/* ~~ This the css file for the Responsive Design of Virtual Eco from Ecommerce Templates.
The first section correponds to the maximum width version of 960 pixels ~~ */
body {
	font: 100%/1.5 Georgia, Arial, serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #000;
}

#container{
	width: 960px;
	background: #fff;
	margin: 0 auto;
	background-color: #fff;
	background-image: url(images/bg1.gif);
	background-repeat: repeat-y;
	color: #000;
	/*text-align: center;*/
}

/* ~~ Header section ~~ */
#banner{
	background-color: #fff;
}
#banner h1{
	margin: 0px;
	padding: .0em;
	font-size: 36px;
	text-align: center;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	color: black;
}
#banner h2{
	margin: -8px 0px 0px 0px;
	padding: .0em;
	font-size: 18px;
	color: #0A2FBC;
	text-align: center;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
#banner h3{
	margin: 0px;
	padding: .0em;
	font-size: 12px;
	color: black;
	text-align: center;
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	line-height: 1.4;
}
#header{
	background-color: #fff;
	}
#head{
	max-width: 960px;
	height: 125px;
	background-color: #fff;
	margin: 0 auto;
	/*text-align: center;*/
}
#headerleft {
	background: #fff;
	width: 57%;
	float:left;
	padding-left: 20px;
}
#headerright {
	background: #fff;
	width: 35%;
	float:left;
	padding-left: 40px;
}
.coname {
	height: 125px;
	padding-top: 0px;
	padding-bottom:0px;
	padding-left:0px;
	display:inline-block;
}

#header .hdrR {
	line-height: 1.1em;
	text-align: right;
	float:right;
	padding-right:16px;
	padding-top:16px;
	color: #666;
}

/* ~~ This is the text navigation only to be shown on mobile screens ~~ */
div.logonav{
	display:none;
}

/* ~~ Top navigation ~~ */
.header-nav {
	background-image:  url(images/topnavbg.jpg);
	font-size: 0.85em;
	font-family : Tahoma;
	color : #fff;
	height: 38px;
	letter-spacing:2px;
	padding-top:9px;
	float:left;
	width:645px;
}
	
/* ~~ Left hand section ~~ */
#left{
	float: left;
	width: 230px;
	margin-left: 24px;
}

#left p { 
	margin-top: 0; 
}
	
/* ~~ Content section ~~ */
#content{
	margin: 0 3em 0 260px;
}

#content h2 { 
	margin: 0;
	color:#0a2fbc;
	text-align: center;
}
	/* ~~ Footer sections ~~ */
#footer{
	clear: both;
	background-color: #0A2FBC;
	Height: 209px;
}
#footer h1{
	font-size: 1.1em;
	color: white;
	margin:0px 0px 0px 0px;
	font-weight:bold;
	text-align: center;
	
}
.news2 h1{
	font-size: 4.1em;
	color: white;
	margin:0px 0px 0px 0px;
	font-weight:bold;
	text-align: center;
	
}
#footer ul{
	padding: 20px 0px 0px 50px;
	font-size: .9em;
	color: white;
	margin:0px 0px 0px 0px;
	font-weight:bold;
			
}
.news ul{
	padding: 20px 0px 20px 75px;
	font-size: .9em;
	color: white;
	margin:0px 0px 0px 0px;
	font-weight:bold;
			
}
div.footer1{
	clear: both;
	background-color: #0A2FBC;
	width:960px;
	height:35px;
	text-align: center;
	color: white
}

#footer2{
	clear: both;
	background-color: #fff;
	background-repeat: repeat-y;
}

#footer a, a:visited{
	text-decoration:none;
	color:white;
}

#footer a:hover, a:active, a:focus { 
	text-decoration:underline;
	color:#ccc;
}

.news{
	color:#fff;
	float:left;
	width:300px;
	background-color: #0A2FBC;
	padding:10px;
	/*height: 175;*/
}

.news1{
	color:#fff;
	float:left;
	width:299px;
	background-color: #0A2FBC;
	border-left: 1px dotted #fff;
	border-right: 1px dotted #fff;
	padding: 10px 10px 13px 10px;
	/*height: 175px;*/
}

.news2{
	color:#fff;
	float:right;
	width:299px;
	background-color: #0A2FBC;
	padding: 10px 10px 29px 10px;
	/*height: 175px;*/
}

#footer2 .ftr1{
	padding-left:10px;
	width:64px;
	background:#fff;
	float:left;
}

#footer2 .ftr2{
	padding-left:10px;
	width:200px;
	background:#fff;
	color:#666;
	float:right;
}

.foo{
	float:left;
	width:95px;
	padding-left:10px;
}

.foo1{
	float:left;
	width:250px;
	border-right: 1px dotted #666;
	padding: 10px;
	color: #666;
}

.foo2{
	float:left;
	width:172px;
	padding: 10px;
	border-right: 1px dotted #666;
	color: #666;
}

.foo3{
	color: #666;
	float:left;
	width:172px;
	padding: 10px;
	border-right: 1px dotted #666;
}

.foo4{
	color: #666;
	float:right;
	width:172px;
	padding: 10px;
}

h6{
	font-size: 1.02em;
	color: #666;
	margin:0px 0px 6px 0px;
	font-weight:bold;
}

#footer2 a, a:visited{
	text-decoration:none;
	color:#333;
}

#footer2 a:hover, a:active, a:focus { 
	text-decoration:underline;
	color:#000;
}

p.footer{
	text-align: center;
	font-size:0.9em;
	color: white;
}

div.end{
	float:left;
width:100%;
text-align:center;
}

div.end{
	display: inline-block;
}

/* ~~ top address section ~~ */
h3{
	font-size: 1.4em;;
	margin: 10px 0px 10px 0px;
	color:#9DBC5F;
}

p.address{
	font-size: 1.2em;
	margin: 0;
	color:#aaa;
}

/* ~~ Top nav bar ~~ */
.topnav {
	padding-left:6px;
}

.topnav a:link{
	text-decoration:none;
	color:#fff;
}

.topnav a:visited{
	text-decoration:none;
	color:#fff;
}

.topnav a:active{
	text-decoration:none;
	color:#fff;
}

.topnav a:hover {
	text-decoration:none;
	color: #ccc;
}

.leftend{
	float:left;
	background-image:  url(images/leftend.jpg);
	width:20px;
	height:53px;
}
	
.rightend{
	float:right;
	background-image:  url(images/rightend.jpg);
	width:20px;
	height:53px;
}

div.manu h3{
  color:#333;
}

div.manu{
float:left;
width:100%;
text-align:center;
font-size:18px;
}

div.manu1{
float:left;
width:100%;
text-align:center;
}

div.manu2{
float:left;
width:46%;
text-align:center;
padding:8px;
}

/* ~~ clear div ~~ */
.clr {
	clear: both;
	line-height: 0;
	font-size: 0;
	height: 0;
	border: none;
}

/* ~~ Left content ~~ */
.leftmenu{
	background:#ECF3EC;
	border: 1px solid #ccc;
	width:198px;
}

.ectmenu1{
  font-size:13px;
}
	
.sm{
	background: #fff;
	width:198px;
	color: #666;
}
	
/* ~~ The navigation list styles ~~ */
ul.nav {
	list-style: none; 
	margin-bottom: 15px; 
	margin-top:0px;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 182px;
	color:#666;
	font-size: 0.9em;
}

ul.nav li {
	border-bottom: 1px solid #ccc; 
}

ul.nav a:link { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 172px;
	color:#666;
}

ul.nav a:visited { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 172px;
	color:#666;
}

ul.nav a:active { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 172px;
}

ul.nav a:hover { 
	text-decoration: none;
	background: #ccc;
	color: #FFF;
}

/* ~~ menu heading ~~ */
.menutop{
	background-image:  url(images/menutop.jpg);
	width:200px;
	height:18px;
	color: #FFF;
	font: 0.87em Tahoma, Arial, Helvetica, sans-serif;
	font-weight:bold;
	padding-left:12px;
	padding-top:2px;
	background-repeat:no-repeat;
}

/* ~~ Link properties ~~ */
a:link{
	text-decoration:none;
	color:#333;
}
a:visited{
	text-decoration:none;
	color:#333;
}
a:active{
	text-decoration:none;
	color:#333;
}
a:hover, a:focus { 
	text-decoration:underline;
	color:#000;
}

/* ~~ store generated link properties ~~ */
a.ectlink:link{
	text-decoration:none;
	color:#333;
}
a.ectlink:visited{
	text-decoration:none;
	color:#333;
}
a.ectlink:active{
	text-decoration:none;
	color:#333;
}
a.ectlink:hover, a.ectlink:focus { 
	text-decoration:underline;
	color:#000;
}
	
/*top search*/
form.searchform{
	margin:0;padding:0;
}

.search-box{
	background:url(images/search-box.jpg) no-repeat top left;
	height: 53px;
	padding: 10px 0 0 10px;
	width: 265px;
	float: left;
}

input.search-field{
	float: left;
	border:0;
	margin:0;
	padding: 3px 0px 0px 4px;
	height:18px;
	background: #fff url(images/search-form.jpg) no-repeat top left;
	width: 202px;
}

input.search-go { 
	float:left;
	border:0;
	margin:0;
	padding:0;
	margin-left: 5px;
	height: 21px;
	width: 21px;
	background: url(images/search-icon.png) no-repeat top left;
	cursor: pointer;
}

input.search-go:hover{ 
	background:url(images/search-icon.png) no-repeat bottom left;
}

/*Minicart properties*/
.mincart {
	width: 198px;
	font-size: 0.96em;
	background-color: #ECF3EC;
}

/*Horizontal rule*/
hr {
	height: 0;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #ECF3EC;
}

/* ~~ Table backgrounds for cart, search etc ~~*/
table.cobtbl{
	background-color: #CAE5AE;
	width:94%;
	margin-left:8px;
} 

td.cobhl{
	background-color:#fff;
	font-weight: normal;
	color:#333;
	font-size:0.9em;
}

td.cobhdr{
       background-color: #669900;
       color:#fff;
}

td.cobll{
	background-color: #fff;
	color : #333;
	font-weight:normal;
	font-size:0.8em;
}


div.tofreeshipping{
       color:#396A3B !important;
}

td.cobll input,  textarea, select{
      border: 1px solid #999;
      border-radius:2px;
      padding:4px;
}

.cartdiscounts, .cartdiscountsamnt{
     color:#396A3B !important;
}


td.cobll input[type="image"]{
border:none;
}

td.cobll input[type="radio"]{
border:none;
}

span.cartoption{
	font-size:0.8em !important;
	color:#333;
}

div.giftwrap a{
  	color:#666;
  	font-size:0.8em;
  	text-decoration:none;
}

div.logintoaccount{
	text-align:left !important;
}

span.willpickup{
font-size:1.1em !important;
}

/*Thanks page*/
td.receiptoption{font-size:0.9em;}
td.receipthl{font-size:1em;}
td.receiptoption strong{font-weight:500;}
td.receiptheading{background:#F6F6F6;font-size:0.9em;color: #333;font-weight:normal !important;border-bottom: 1px solid #99CC46;border-top: 1px solid #99CC46;}
td.receiptheading strong{font-weight:500;}
hr.receipthr{display:none;}

/* ~~ Store buttons ~~*/
input.login, input.sccheckout, input.logintoaccount, input.search	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #fff;
	background: #669900;
	border: 1px solid #999;
	border-radius: 4px;
	cursor: pointer;
}

input.login:hover, input.sccheckout:hover, input.logintoaccount:hover, input.search:hover{
	background:#fff;
	color:#666;
}

/* The product page - view all the available classes at http://www.ecommercetemplates.com/help/css-layouts.asp
-------------------------------------*/
div.prodfilter{
	float:left;
	background-color:#F9F9F4;
	border: 1px dotted #D7D1C9;
	padding:6px;
	color: #42619a;
	margin-bottom:10px;
	margin-top:10px;
}

div.prodfilterbar{
	float:left;
	width:100%;
}

div.filtertext{
 	padding:8px;
}

select.prodfilter{
	padding:0px;
	margin:0px;
}

div.product{
	padding:6px;
	width:46%;
	float:left;
	height:280px;
	margin:2px;
  	border:1px solid #ccc;
	position:relative;
}

div.prodnavigation{
	padding:10px 0px 10px 12px;
	float:left;
	width:96%;
	font-size:0.9em;
	background-color:#ddd;
	border-bottom: 1px solid #669900;
}

div.prodimage{
	padding: 6px;
	text-align:center;
}

div.product:hover{
	background-color:#fff;
	border: 1px solid #669900;
}


div.prodname{
	padding-top:6px;
	font-size: .85em;
}
div.listprice{
	font-size: .75em;
	font-weight:normal;
	float:left;
	width:96%;
	padding:0px 0px;
	color:#DA6A1E;
	margin-left:0px;
	display: none;
}
div.prodprice{
	font-size: 1em;
	width:40%;
	color:#666;
	position:absolute;                  
    bottom:0;                          
    Left:4;         
	
}
div.prodcurrency{
	float:left;
	width:100%;
	font-size: 0.7em;
	color:#666;
}

div.pagenums{
	text-align:center;
	float:left;
	padding:20px 0px 20px 10px;
}

div.addtocart{
	text-align:center;
	float:left;
	height: 30px;
    width: 120px;
	position:absolute;                  
    bottom:2;                          
    right:2;         
}

/* The product detail page 
-------------------------------------*/
div.detailprodnavigation{
	width:96%;
        margin-bottom:12px;
}

div.detailimage{
	width:190px;
	padding:10px;
	float:left;
	margin-top:10px;
} 

img.detailimage{
  max-width:190px;
  max-height:100%;
}


div.detailid {
	color:#666;
	width:20;
	font-size: 0.9em;
	align:left;
}

div.detailname {
	font-size: 1.2em;
	float:right;
	width:67%;
	/*margin-top:10px;
  	margin-bottom:12px;*/
	border-bottom: 1px solid #ccc;
}

span.detaildiscountsapply{
	margin-left:36px;
        color:#669900;
        font-size:0.9em;
}

div.detaildiscounts{
	width:57%;
	color:#669900;
	float:left;
        font-size:0.9em;
margin-left:5px;
}

div.detailmanufacturer{
	float:left;
	width:60%;
	margin:0px;
	padding:0px;
        color:#666;
        font-size:0.9em;
}

div.detailsku{
	float:left;
	width:67%;
	margin:10px;
        color:#666;
}

div.detailinstock{
	float:right;
	width:67%;
}

div.detaildescription{
	font-size: 0.9em;
	margin:5px 0px;
	padding-top:4px;
	line-height:1.8em;
	float:right;
	width:67%;
}

div.detailprice{
	font-size: 1.2em;
	font-weight:bold;
	float:left;
	width:20%;
	color:#333;
	margin-left:10px;
        align:left;
}

div.detaillistprice{
	font-size: 1.em;
	font-weight:normal;
	float:left;
	width:96%;
	padding:6px 0px;
	color:#DA6A1E;
	margin-left:10px;
}

div.detailcurrency{
	padding-top: 6px;
	font-size: 0.7em;
	float:left;
	width:96%;
	color:#666;
	margin-left:10px;
	border-bottom: 1px solid #ccc;
	padding-bottom:20px;
}

div.detailoption{
	width:100%;
}

div.detailoptions{
	padding: 6px;
	float:left;
	width:81%;
	margin-left:0px;
}

select.detailprodoption{
	font-size: 0.9em;
	width:50%;
	margin:7px;
	border:1px solid #ccc;
	padding:2px;
}

input.detailprodoption{
	font-size: 0.9em;
	margin:7px;
	border:1px solid #ccc;
        padding:2px;
}


div.detailoptiontext{
	padding: 6px;
	width:32%;
	float:left;
	clear:both;
}

div.detailmultioptiontext{
	padding: 6px;
	width:37%;
	clear:right;
}

div.previousnext{
	padding-top:20px;
	padding-bottom:6px;
	float:right;
	width:100%;
	text-align:center;
	font-size:0.9em;
	border-top:1px solid #ccc;
}

div.emailfriend{
	padding-top: 10px;
	text-align:center;
	float:right;
	width:100%;
}

td.emfhl{
	background-color:#aaa;
	font-size:1.2em;
	color:#fff;
	font-weight:bold;
}

td.emfll{
	line-height:18px;
}

div.detailquantity{
	float:left;
	width:170px;
  
}

div.detailquantitytext{
	margin-top:14px;
	float:left;
	width:45%;
	text-align:right;
}

div.detailquantityinput{
	margin-top:16px;
	float:right;
	width:45%;
	text-align:left;
	padding:0px;
	height:65px;
}

#w0quant{
	height:21px;
	width:50px;
	border:1px solid #ccc;
}

div.detailaddtocart,.detailoutofstock{
	float:left;
	/*position: fixed;*/
        text-align:left;
	margin-top:4px;
        margin-bottom:4px;
        width:20%;
}

div.detailnotifystock{
	text-align:center;
	padding-top:6px;
	float:left;
	width:98%;
}

div.review{
	float:left;
	margin-top:16px;
	width:90%;
	font-size:0.9em;
}

hr.review{
	height: 0;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #bbb;
	padding:4px;
	margin-top:6px;
}

div.reviewprod{
	background-color:#eee;
	padding:10px;
}
/* The category page 
-------------------------------------*/
div.category{
	width:43%;
	float:left;
	line-height:1.4em;
  	font-size:0.8em;
    padding:10px;
	border:1px solid #ccc;
	background-color:#fff;
	margin:0px 0px 16px 16px;
	height:310px;
}

div.category:hover{
	background-color:#fff;
	border: 1px solid #669900;
}

div.catnavigation{
	padding:10px 0px 10px 12px;
	float:left;
	width:97%;
	font-size:1em;
	background-color:#ddd;
	border-bottom: 1px solid #669900;
	margin-bottom:10px;
}

.catnavwrapper{
	background:#fff !important;
	border: 1px solid #fff !important;
}

div.navdesc{
	display:none; /* Removes the text "View all products in all categories */
}

div.catimage{
	width:100%;
	/*float:left;*/
	text-align: center;
}

div.catdesc{
	padding:4px 0px 4px 4px;
}

div.catname{
	padding:4px 0px 0px 4px;
        font-size:1.2em;
	text-align: center;
	font-weight: bold;
}

.catdiscounts, .allcatdiscounts{
	padding-left:10px;
	font-weight:normal;
	color:#669900;
	font-size:0.9em;
}

div.categorymessage{
	padding-top:0px;
	font-size: 1.3em;
	text-align: center;
}

p.noproducts{
       padding-top:28px;
       text-align:left !important;
}

/*Home page products*/
div.prod1{
	border-right: 1px #999 dotted;
	border-bottom: 1px #999 solid;
	width:310px;
	padding:6px;
	float:left;
        height:220px;
}

div.prod2{
	border-bottom: 1px #999 solid;
	width:310px;
	padding:6px;
	float:right;
        height:220px;
}

div.prod3{
	border-right: 1px #999 dotted;
	width:310px;
	padding:6px;
	float:left;
	border-bottom: 1px #999 solid;
        height:220px;
}
div.prod4{
	width:310px;
	padding:6px;
	float:right;
	border-bottom: 1px #999 solid;
        height:220px;
}

/* ~~home page image ~~ */
div.prodt{
	width:125px;
	float:left;
}

/* ~~ the product text on home page ~~ */
div.prodblurb{
	width:170px;
	float:right;
	color:#666;
}

p.homeblurb{
	font-size:0.8em;
}

/* ~~ the home page product header ~~ */
p.prodhead{
	font-size: 1.2em;
	font-weight: bold;
	margin: 0px;
	color:#690;
}

/* ~~ the home page product price ~~ */
p.homeprice{
	font-size: 1.1em;
	font-weight: bold;
	margin: 0px;
}

/* ~~ the home page category section ~~ */
div.homecats-head{
	width:auto;
	margin-left: 8px;
	background-color: #ECF3EC;
}
div.homecats{
	width:660px;
	text-align:center;
	}
div.homecats h1{
	margin:0px;
	padding:.2em;
	font-size:14px;
	text-align:center;
	
}
div.homecats h3{
	margin:0px;
	padding:.75em;
	font-size:14px;
	text-align:center;
	color: black;
}
div.homecats ul{
	margin-left: 20px;
	padding: .2em;
	font-size: 14px;
	text-align: left;
	font-weight: bold;
	
}
div.homecat1{
	width: 202px;
	height: 178px;
	float: left; 
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/shark-Vacuum.jpg);
}

div.homecat2{
	width: 202px;
	height: 178px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/Bissell-Vacuum.jpg);
}

div.homecat3{
	width:202px;
	height: 178px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/Dyson-Vacuum.jpg);
}
div.homecat4{
	width: 202px;
	height: 178px;
	float: left; 
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/Kirby-Vacuum-1.jpg);
}

div.homecat5{
	width: 202px;
	height: 178px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/Kenmore-Vacuum-1.jpg);
}

div.homecat6{
	width:202px;
	height: 178px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	background-image: url(images/Oreck-Vacuum.jpg);
}
div.homecat7{
	width: 202px;
	height: 45px;
	float: left;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}

div.homecat8{
	width: 202px;
	height: 45px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}

div.homecat9{
	width:202px;
	height: 45px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}
div.homecat10{
	width: 202px;
	height: 45px;
	float: left;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}

div.homecat11{
	width: 202px;
	height: 45px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}

div.homecat12{
	width:202px;
	height: 45px;
	float: right;
	margin: 8px;
	border-style: solid;
	border-width: thin;
	border-radius:15px;
	/*background-image: url(images/vacuum1.jpg);*/
}
p.cattitle{
	font-size: 1.8em;
	color: #666;
	margin:6px;
}


/* This is the first breakpoint and is for screen sizes between 750 and 980 pixels. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below*/
@media screen and (max-width: 959px) {

#container{
	width: 750px;
	background-repeat: repeat-y;
}

.header-nav {
	background-image:  url(images/topnavbg.jpg);
	letter-spacing:1px;
	width:465px;
}

#footer{
	clear: both;
	background-color: #0A2FBC;
}

div.footer1{
	clear: both;
	background-color: #0A2FBC;
	width:748px;
	height:35px;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-repeat: repeat-y;
}

#footer a, a:visited{
	text-decoration:none;
	color:#333;
}

#footer a:hover, a:active, a:focus { 
	text-decoration:underline;
	color:#ccc;
}

.news{
	width:354px;
}

.news1{
	width:353px;
	border-right: 0px;
}

.news2{
	display:none;
}

#footer2 .ftr1{
	padding-left:10px;
	width:64px;
	background:#fff;
	float:left;
}

#footer2 .ftr2{
	padding-left:10px;
	width:200px;
	background:#fff;
	color:#666;
	float:right;
}

/* ~~ hide footer sections ~~ */
.foo{
	display:none;
}

.foo1{
	display:none;
}

.foo2{
	float:left;
	width:172px;
	padding: 10px;
	border-right: 1px dotted #666;
	margin-left:6px;
}

.foo3{
	color: #666;
	float:left;
	width:172px;
	padding: 10px;
	border-right: 1px dotted #666;
}

.foo4{
	color: #666;
	float:right;
	width:292px;
	padding: 10px;
}

div.end{
	background-color: #fff;
	width:750px;
	height:35px;
	clear: both;
}

.leftmenu{
	background: #f6f6f6;
	border: 1px solid #ccc;
	width:198px;
}
	
.sm{
	background: #fff;
	width:198px;
	color: #666;
}


.search-box{
	width: 235px;
}

input.search-field{ 
	width: 202px;
}


/* The product page
-------------------------------------*/
div.prodfilter{
	display:none;
}

div.prodfilterbar{
	display:none;
}

  /* The product detail page 
-------------------------------------*/
img.detailimage{
  max-width:300px;
  max-height:100%;
}

div.detailid {
	float:left;
        width:96%;
        margin-left:10px;
}

div.detailmanufacturer {
	float:left;
        width:96%;
        margin-left:10px;
}

div.detailname {
	float:left;
        width:96%;
        margin-left:10px;
}

div.detaildiscounts{
	float:left;
        width:96%;
        margin-left:10px;
}

.detaildiscountsapply{
        display:none; /*Removes Discounts Apply text*/
}

div.detaildescription {
	float:left;
        width:96%;
        margin-left:10px;
}

div.detailoptions{
	width:91%;
}

/* The category page 
-------------------------------------*/
div.category{
width:94%
}


/*Home page products*/
div.prod1{
	width:440px;
	border-right: none;
        height:auto;
}

div.prodt{
	width:125px;
	float:left;
}

div.prodblurb{
	width:290px;
	float:right;
	color:#666;
}

div.prod2{
	width:440px;
	float:left;
        height:auto;
}

div.prod3{
	width:440px;
	border-right: 1px solid #fff;
        height:auto;
}
div.prod4{
	width:440px;
	float:left;
        height:auto;
}

div.homecats{
	width:450px;
}


p.cattitle{
	font-size: 1.8em;
	color: #666;
	margin:2px;
}

}


/* This is the second breakpoint and is for screen sizes between 468 and 758 pixels. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below
*/
@media screen and (max-width: 758px) {

#container{
	width: 468px;
}

.header-nav {
	background-image:  url(images/topnavbg.jpg);
	width:183px;
}


/*hide header parts*/
#header .hdrR {
	display:none;
}

/*Reduce top navigation links*/
span.nav02{
	display:none;
}

/*Enable top navigation hidden previously*/
div.logonav{
	display:inline;
	margin-left:104px;
}

/* ~~ Remove left hand section ~~ */
.leftmenu{
	display:none;
}

#left{
	display:none;
}
	
.sm{
	display:none;
}

.lefticon{
	display:none;
}

.menutop{
	display:none;
}

/* ~~ Content section ~~ */
#content{
	margin: 0 3em 0 1em;
	width:434px;
}

h2{
	margin:0px 0px 0px 12px;
}

#footer{
	clear: both;
	background-color: #0A2FBC;
}

div.footer1{
	clear: both;
	background-color: #0A2FBC;
	width:466px;
	height:35px;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-repeat: repeat-y;
}

#footer a, a:visited{
	text-decoration:none;
	color:#333;
}

#footer a:hover, a:active, a:focus { 
	text-decoration:underline;
	color:#ccc;
}

.news{
	width:446px;
}

/*Hide and format bottom sections*/
.news1{
	display:none;
}

.news2{
	display:none;
}

#footer2 .ftr1{
	padding-left:10px;
	width:64px;
	background:#fff;
	float:left;
}
#footer2 .ftr2{
	padding-left:10px;
	width:200px;
	background:#fff;
	color:#666;
	float:right;
}

.foo{
	display:none;
}

.foo1{
	display:none;
}

.foo2{
	float:left;
	width:192px;
	padding: 10px;
	border-right: 1px dotted #666;
	margin-left:24px;
}

.foo3{
	color: #666;
	float:left;
	width:182px;
	padding: 10px;
	border-right: 0px;
}

.foo4{
	display:none;
}

.topnav {
	padding-left:4px;
	font-size:0.9em;
	float:left;
}

div.end{
	background-color: #fff;
	width:468px;
	height:35px;
	clear: both;
}

.search-box{
	width: 235px;
}

input.search-field{ 
	width: 202px;
}


/* The category page 
-------------------------------------*/
div.category{
width:88%;
}

/*Home page products*/
div.prod1{
	width:420px;
	border-right: 0px;
	margin-left:10px;
}

div.prodt{
	width:125px;
	float:left;
}

div.prodblurb{
	width:270px;
	float:right;
	color:#666;
}

div.prod2{
	width:420px;
	float:left;
	margin-left:10px;
}

div.prod3{
	width:420px;
	border-right: 0px;
	margin-left:10px;
}
div.prod4{
	width:420px;
	float:left;
	margin-left:10px;
}

div.homecats{
	width:96%;
	margin:2px;
}

div.homecat1{
	width:45%;
}
div.homecat2{
	width:45%;
}

div.homecat3{
	width:45%;
}



p.cattitle{
	margin:0px 0px 6px 16px;
}

/*Hide left hand details column in the cart*/
.cobcol1{
	display:none;
}

/*Reduce width of the additional info field on checkout*/
textarea.addinfo{
	width:150px;
}

}


/* This is the third breakpoint and is for smartphones. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below
*/
@media screen and (max-width:400px) {

#container{
	width: 316px;
	background-image: none;
}

.header-nav {
	background-image:  url(images/topnavbg.jpg);
	width:31px;
}


span.nav02, span.nav01{
	display:none;
}

.leftmenu{
	display:none;
}

#left{
	display:none;
}
	
.sm{
	display:none;
}

.lefticon{
	display:none;
}

.menutop{
	display:none;
}

.leftend{
	
}
	
.rightend{
	
}

#content{
	padding-top: 0em;
	margin: 0 3em 0 0;
	width:312px;
}

h2{
	margin-left:12px;
}

div.homecats{
  width:96%;
  text-align:center;
}

div.homecat1{
	width:95%;
}
div.homecat2{
	width:95%;
}

div.homecat3{
	width:95%;
}

#footer{
	clear: both;
	background-color: #55A6FF;
}
div.footer1{
	display:none;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-image: none;
}

#footer a, a:visited{
	text-decoration:none;
	color:#333;
}

#footer a:hover, a:active, a:focus { 
	text-decoration:underline;
	color:#ccc;
}

.news{
	width:294px;
}

.news1{
	display:none;
}

.news2{
	display:none;
}

.foo{
	display:none;
}

.foo1{
	display:none;
}

.foo2{
	float:left;
	width:136px;
	padding: 3px;
	border-right: 1px dotted #666;
	margin-left:2px;
}

.foo3{
	color: #666;
	float:left;
	width:160px;
	padding: 3px;
	border-right: 0px;
}

.foo4{
	display:none;
}

div.end{
	display:none;
}

.search-box{
	width: 235px;
}

input.search-field{ 
	width: 202px;
}


/* The product page
-------------------------------------*/
div.product{
	width:95%;
	margin-left:2px;
}

/* The category page 
-------------------------------------*/
div.category{
width:85%;
}

/*Home page products*/

div.prod1{
	width:308px;
	border-right: 0px;
	margin-left:2px;
	padding:0px;
}

div.prodt{
	width:125px;
	float:left;
}

div.prodblurb{
	width:165px;
	float:right;
	color:#666;
}

div.prod2{
	width:308px;
	float:left;
	margin-left:2px;
	padding:6px 0px 0px 0px;
}

div.prod3{
	width:308px;
	border-right: 0px;
	margin-left:2px;
	padding:6px 0px 0px 0px;
}

div.prod4{
	width:308px;
	float:left;
	margin-left:2px;
	padding:6px 0px 0px 0px;
}

p.cattitle{
	margin:0px 0px 6px 6px;
}

div.manu1, div.manu2{
  width:96%;
  text-align:center;
}

h6{
	font-size: 1em;
	margin:0px 0px 2px 
}

/*Reduce fone size in the cart*/
td.cobll, td.cobhl{
	font-size:0.8em;
}

/* ~~ Remove left hand cart column ~~*/
.cobcol1{
	display:none;
}

/* ~~ Modify additional info field on checkout ~~*/
textarea.addinfo{
	width:150px;
}

}
#Layer1 {
	position: absolute;
	left:760px;
	top:34px;
	width:249px;
	height:100px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:18px;
	text-align:center;
}
/* ~~ Coupon Page ~~*/
div.coupon{
	width:660px;
	height: 178px;
    background-color: lightgray;
	border: dashed;

}
div.coupon-title{
	text-align: center;
	font-size: 24px;
	font-style:oblique;   
	color: black;
}
div.coupon-text-box{
	width: 225px;
	height: 120px;
	background-color: white;
	margin-left: 10px;
	float:left;
	
}
div.coupon-text-box ul{
	font-size: 14px; 
	padding: 10px 0px 0px 20px;
}
div.coupon-est-box{
	width: 200px;
	height: 120px;
	background-color: white;
	margin: 0px 10px 0px 0px; 
	border:solid;
	border-radius: 15px;
	float:right;
}
div.coupon-est-circle{
	width: 120px;
	height: 120px;
	background-color: white;
	margin: 0px 40px 0px 0px; 
	border:double;
	border-radius: 50%;
	float:right;
	text-align: center;
	padding: 0px 0px 0px 0px;
}
div.coupon-est-box h1{
	font-size: 42px;
	text-align: center;
	margin: 0px 0px 0px 20px;
}
div.coupon-est-box h2{
	font-size: 12px;
	
	text-align: center;
	margin: 200px 0px 0px 20px;
}
/* ~~ Coupon Mad Money ~~ */

#Layer1 {
	position:absolute;
	top:1px;
	width:1000px;
	height:100px;
	background-color:#FFF;
	left: 300px;
	text-decoration: none;
}
#Layer2 {
	position:absolute;
	left:300px;
	top:106px;
	width:1000px;
	height:35px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:left;
}
#Layer3 {
	position: absolute;
	/*left:350px;
	top:185px;*/
	width:644px;
	height:600px;
}
.H1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	text-align:left;
}
#Layer4 {
	position: absolute;
	left:1px;
	top:1px;
	width:644px;
	height:245px;
	font-family:0;
	font-size:0px;
}
#Layer5 {
	position: absolute;
	left:-482px;
	top:-286px;
	width: 310px;
	height:231px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}
#Layer6 {
	position: absolute;
	left:-589px;
	top:37px;
	width:612px;
	height:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}
#Layer7 {
	position: absolute;
	left:165px;
	top:180px;
	width:150px;
	height:92px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height: 1.5;
}
#Layer8 {
	position:absolute;
	left:0px;
	top:44px;
	width:276px;
	height:28px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	text-align:center;
	color: #000;
}
#Layer9 {
	position:absolute;
	left:-385px;
	top:54px;
	width:250px;
	height:15px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	text-align:center;
	text-align:left;
	font-weight: bold;
	color: #000;
}
#Layer10 {
	position:absolute;
	left:312px;
	top:40px;
	width:270px;
	height:55px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align:center;
	text-align:center;
	color: #999;
}
#Layer11 {
	position:absolute;
	left:-416px;
	top:142px;
	width:990px;
	height:20px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	text-align:center;
	text-align:left;
	font-weight: bold;
	padding-left: 10px;
}
#Layer12 {
	position:absolute;
	left:325px;
	top:8px;
	width:150px;
	height:35px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#000;
	font-weight:bold;
	text-align:center;
	background-color: #FFF;
	line-height: 1.3;
}
#Layer13 {
	position:absolute;
	left:325px;
	top:44px;
	width:150px;
	height:30px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	text-align:center;
	color:#F00;
}
#Layer14 {
	position:absolute;
	left:325px;
	top:79px;
	width:150px;
	height:70px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	text-align:left;
	line-height: 1.4;
}
#Layer15 {
	position:absolute;
	left:0px;
	top:97px;
	width:150px;
	height:33px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	text-align:center;
	line-height: 1.3;
}
#Layer16 {
	position:absolute;
	left:161px;
	top:-66px;
	width:150px;
	height:37px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	font-weight: bold;
	line-height: 1.3;
}
#Layer17 {
	position:absolute;
	left:161px;
	top:-12px;
	width:150px;
	height:22px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:normal;
	text-align:center;
	text-decoration: line-through;
}
#Layer18 {
	position:absolute;
	left:161px;
	top:9px;
	width:150px;
	height:28px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	text-align:center;
	color: #F00;
}
#Layer19 {
	position:absolute;
	left:161px;
	top:43px;
	width:150px;
	height:36px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:normal;
	text-align:center;
	line-height: 1.3;
}
#Layer20 {
	position:absolute;
	left:161px;
	top:96px;
	width:150px;
	height:33px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	text-align:center;
	color: #000;
	line-height: 1.3;
}
#Layer21 {
	position:absolute;
	left:0px;
	top:138px; 
	width:150px;
	height:22px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	font-weight: bold;
	line-height: 1.3;
}
#Layer22 {
	position:absolute;
	left:0px;
	top:200px;
	width:150px;
	height:24px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
	text-align:center;
	font-weight: bold;
	color: #F00;
}
#Layer23 {
	position:absolute;
	left:0px;
	top:240px;
	width:150px;
	height:53px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align:center;
}
#Layer24 {
	position:absolute;
	left:319px;
	top:5px;
	width:250px;
	height:25px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	text-align:center;
}
#Layer26 {
	position:absolute;
	left:0px;
	top:301px;
	width:150px;
	height:31px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	text-align:center;
	line-height: 1.3;
}
#Layer27 {
	position:absolute;
	left:162px;
	top:137px;
	width:150px;
	height:19px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	text-align:center;
}
.red {
	font:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FF0000;
	font-weight:bold;
	text-align:center;
}
#Layer28 {
	position: absolute;
	left:6px;
	top:75px;
	width:315px; 
	height:30px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
	text-align: center;
	color: #F00;
	font-weight: bolder;
	line-height: 1.3;
}
#Layer29 {
	position: absolute;
	/*left:10px;*/
	top:135px;
	width:315px;
	height:40px;
	font-size: 16px;
	text-align: right;
	color:#F00;
	font-weight: bold;
} 

#Layer30 {
	position: absolute;
	left:162px;
	top:244px;
	width:150px;
	height:23px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align: center;
}
#Layer31 {
	position: absolute;
	left:162px;
	top:301px;
	width:150px;
	height:33px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	text-align:center;
	
	line-height: 1.3;
}
.ul {
	list-style: inside disc;
	margin-left: 0;
	padding-left: 1em;
	text-indent: -4em;
	line-height: 1.9;
}
#Layer32 {
	position: absolute;
	left:32px;
	top:4px;
	width:255px;
	height:44px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:240%;
	text-align:left;
	color:#000;
	font-style: normal;
	line-height: normal;
	padding: 0px;
	margin-top: 0px;
}
#Layer33 {
	position: absolute;
	left:416px;
	top:3px;
	width:276px;
	height:42px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	text-align:center;
	color:#000;
	font-weight: bold;
}