/* ~~ 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 ~~ */
@font-face {
	font-family: 'Titillium';
	src: url('css/fonts/TitilliumText22L004-webfont.eot');
	src: url('css/fonts/TitilliumText22L004-webfont.eot?#iefix') format('embedded-opentype'), url('css/fonts/TitilliumText22L004-webfont.woff') format('woff'), url('css/fonts/TitilliumText22L004-webfont.ttf') format('truetype'), url('css/fonts/TitilliumText22L004-webfont.svg#TitilliumText22LMedium') format('svg');
	font-weight: normal;
	font-style: normal;
}
body {
	font: 100%/1.5 Verdana, Arial, serif;
	margin: 0;
	padding: 0;
	color: #000;
	background-image: url(images/shantibackground.png);
}

#topcontainer{
	font-family: 'Titillium';
	width: 100%;
	height:120px;
	background-color:#fff;
	padding-bottom:20px;
	-webkit-box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);
	-moz-box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);
	box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);
}
#topcontainer .stripe {
	background-color:#069;
	height: 25px;
	padding-top: 1px;
	-webkit-box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);
	-moz-box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);
	box-shadow:inset 0px -5px 20px rgba(0,0,0,0.1),0px 5px 5px rgba(0,0,0,0.1);

}
#topcontainer .stripe a, a:hover, a:active, a:focus, a:visited {
	color:#fff;
}
#topcontainer .box {
	width:960px;
	margin:0 auto;
	padding-top:5px;

}

#topcontainer .login {
	float:right;
	color: #FFF;
}
#topcontainer .hdrRtop {
	line-height: 20px;
	text-align: right;
	float:right;
	padding-top: 20px;
	padding-right:16px;
	color: #666;
}

.texttopright, .texttopmid {
	width: 300px;
	padding-left: 20px;
	float:left;
	color: #FFF;
	font-size:14px;
	text-transform: uppercase;
	font-family: 'Titillium';
	
}


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

/* ~~ Header section ~~ */
#banner{
	background-color: #fff;
}

#banner h1{
	margin: 0;
	padding: .5em;
}

#header {
	background: #fff;
}

#header .coname {
	width:518px;
	height:125px;
	padding-top: 10px;
	padding-bottom:5px;
	padding-left:5px;
	float:left;
	background-image:  url(images/logo320.gif);
	background-repeat:no-repeat;
}

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




div.thead {
	border-bottom:3px solid #FFE681;
	height:50px;
}

div.tlinks {
	width:50%;
	float:left;
	margin:18px 0px;
	color:#667903;
	font-size:0.8em;
}
div.tnote {
	float:right;
	font-family: 'Titillium';
	text-transform:uppercase;
	color:#069;
}
/* ~~ This is the text navigation only to be shown on mobile screens ~~ */
div.logonav{
	display:none;
}
span.nav03{
	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;
}

#wrapper{width:960px;margin:0 auto;}

/* ~~ Fix menu to top of page on scroll ~~ */
	
.fixed {
    position:fixed;
    top:0;
	z-index: 999;
}
	

/* ~~ Left hand section ~~ */
#left{
	float: left;
	width: 155px;
	margin-left: 15px;
	margin-top: 0.2em;
}

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

#content h2 { 
	margin: 0;
	color:#669900;
}
/* ~~ Content wide section ~~ */
#contentwideindex{
	width: 940px;
	padding-top: 0px;
	padding-left: 0px;
	margin:0 auto;

}
	/* ~~ Footer sections ~~ */
#footer{
	clear: both;
	background-color: #2d9718;
}

div.footer1{
	clear: both;
	background-color: #2d9718;
	background-image: url(images/ftr.jpg);
	width:960px;
	height:35px;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-image: url(images/ftrbg.gif);
	background-repeat: repeat-y;
	font-size: 0.9em;
}

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

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

.news{
	color:#fff;
	float:left;
	width:300px;
	background-color: #2d9718;
	padding:10px;
}

.news1{
	color:#fff;
	float:left;
	width:299px;
	background-color: #2d9718;
	border-left: 1px dotted #fff;
	border-right: 1px dotted #fff;
	padding: 10px;
}

.news2{
	color:#fff;
	float:right;
	width:299px;
	background-color: #2d9718;
	padding: 10px;
}

#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.2em;
	color: #069;
	margin:0px 0px 6px 0px;
	font-weight:bold;
	font-family:  'Titillium', Verdana;
}

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

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

p.footer{
	font-size:0.9em;
	color: #666;
}

div.end{
	background-color: #fff;
	background-image: url(images/ftrbtm.gif);
	width:960px;
	height:35px;
	clear: both;
}

/* receipt
-------------------------------------*/
.receiptbody{
	background-color:#FFF;
}
.receiptoption{
	background-color:#FFF;
}
.receipthr{height: 0;border-width: 1px 0 0 0;border-style: solid;border-color: #9EBE25;}
.receipthl{
	background-color:#6C6;
}
.receiptheading{
	background-color:#693;
	color: #FFFFFF;
	font-weight:bold;
}
/* General 
-------------------------------------*/


TD {
	font-size: 11px;
	font-family : Verdana;
	color: #333;
}

P {
	font-size: 11px;
	font-family : Verdana;
	color: #333;
}

TD.smaller {
	font-size: 9px;
	font-family : Verdana;
	color : #333;
}

P.smaller {
	font-size: 9px;
	font-family : Verdana;
	color : #333;
}
OPTION.oostock {
color : #A0A0A0;
}
/* dynamic menu
-------------------------------------*/

ul.ectmenu1 {
	list-style: none;
	border:0px solid;
	font-size:10px;
	font-weight:200;
	padding:0px;
	z-index:1000;
}
li.ectmenu1 {
	border: 1px dotted #F9F9F6;
	padding:2px;
	width: 138px;
}
li.ectmenuhassub1 a{
display:block;
padding:2px;
background-image:url(images/arrow.gif);
}
li.ectmenuhassub1 a:hover{
	display:block;
	padding:2px;
	background-image:url(images/arrowov.gif);
	color: #9C0;
}
li.ectmenu1 a{
	display:block;
	padding:2px;
	color: #333;
}
li.ectmenu1 a:hover{
	color: #9C3;
}

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

p.address{
	font-size: 0.8em;
	margin: 0;
	color:#666;
	padding-top:25px;
}


/* ~~ 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;
}

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

/* ~~ Left content ~~ */
.leftmenu{
	background:#FFF;
	border: 1px solid #ccc;
	width:145px;
}
	
.sm{
	background: #fff;
	width: 198px;
	color: #666;
}
	
	/* ~~ The navigation list styles ~~ */
ul.navt {
	list-style: none; 
	margin-bottom: 15px; 
	margin-top:0px;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 135px;
	font-size:12px;
	color:#666;
}
ul.navt li {
	border-bottom: 1px solid #ccc; 
}
ul.navt a:link { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 125px;
	color:#666;
}
 ul.navt a:visited { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 125px;
	color:#666;
}
 ul.navt a:active { 
 	text-decoration: none;
	padding: 5px 5px 5px 5px;
	display: block; 
	width: 125px;
}
ul.navt a:hover { 
	text-decoration: none;
	background: #ccc;
	color: #FFF;
}



/* ~~ menu heading ~~ */
.menutop{
	display: block;
	background: #066;
	width:143px;
	height:20px;
	color: #FFF;
	font: 0.87em Tahoma, Arial, Helvetica, sans-serif;
	font-weight:bold;
	padding-left:5px;
	padding-top:2px;
	border-top-left-radius: 10px;

-moz-border-radius-topleft: 10px;

-webkit-border-top-left-radius: 10px;

border-top-right-radius: 10px;

-moz-border-radius-topright: 10px;

-webkit-border-top-right-radius: 10px;
}

/* ~~ Link properties ~~ */
a:link{
	text-decoration:none;
	color:#106F26;
}
a:visited{
	text-decoration:none;
	color:#106F26;
}
a:active{
	text-decoration:none;
	color:#106F26;
}
a:hover, a:focus { 
	text-decoration:none;
	color:#099;
}

/* ~~ store generated link properties ~~ */
a.ectlink:link{
	text-decoration:none;
	color:#106F26;
}
a.ectlink:visited{
	text-decoration:none;
	color:#106F26;
}
a.ectlink:active{
	text-decoration:none;
	color:#106F26;
}
a.ectlink:hover, a.ectlink:focus { 
	text-decoration:underline;
	color:#333;
}
	

/*Minicart properties*/
.mincart {
	font-size: 0.85em;
	border-width: 1px;
	border-color: #06F;
	text-align: left;
	margin-left: 5px;
}
/* one line minicart and minilogin
-------------------------------------*/
div.minicartoneline{
background:#069;
width:200px;
color:#FFF;
}
div.minicartoneline1{
padding:2px;
font: normal 10px Arial, sans-serif;
float:left;
color:#FFF;
}
div.minicartoneline2{
padding:2px;
font: normal 10px Arial, sans-serif;
float:left;
color:#FFF;
}
div.minicartoneline3{
padding:2px;
font: normal 10px Arial, sans-serif;
color:#FFF;
}
/* css  minicart and minilogin
-------------------------------------*/
div.minicart{
border:dotted 1px #06F;
background:#fff;
margin:4px auto;
width:130px;
padding:2px;
}
div.minicartcnt{
	text-align:left;
	padding:4px;
	font-size:10px;
	font-family: Verdana;
	border:0px dotted #06F;
	background-color: #fff;
}
span.minicartdsc{
text-align:center;
font: normal 10px;
font-family: Verdana;
color:#ff6600;
}

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



/*Cart / search table backgrounds*/
table.cobtbl{
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 1px 1px 3px #666;
	border-collapse: collapse;
} 

td.cobhl{
	background-color:#fff;
	font-weight: bold;
	color:#333;
}

td.cobll{
	background-color: #fff;
	color : #333;
}
td.cobhdr{
background-color:#B2D77A;
font-size:12px;
font-weight: normal;
text-transform: uppercase;
color:#fff;

}
/* The product page
-------------------------------------*/
/* ~~ the product filter bar ~~ */

div.prodfilter{
float:left;
background-color:#066;
border: 1px dotted #fff;
padding:2px;
font-weight:normal;
font-size: 11px;
font-family: Verdana;
height: 22px;
color: #fff;
margin-bottom:10px;
margin-top:10px;
}
div.prodfilterbar{
float:left;
width:760px;
}

select.prodfilter{
padding:0px;
margin:0px;
}
/* ~~ promo overlay ~~ */
.specialimage
{
position: relative;
top: -80px;
margin-left: -40px;
z-index: 10;
}

/* ~~ the main product div ~~ */
div.product{
	padding:3px;
	width:230px;
	float:left;
	height:320px;
	margin:2px;
	border:1px solid #9DBC5F;
	background-color:#fff;
	font-size: 0.8em;
}

/* ~~ top breadcrumb navigation ~~ */
div.prodnavigation{
	padding:10px;
	float:left;
	width:90%;
}

/* ~~ top checkout button ~~ */
div.checkoutbutton{
	display:none;
}

/* ~~ ect buttons checkout ~~ */
input.ectbutton,button.ectbutton{
	box-shadow: 0px 1px 4px 0px #BCC8DC;
background-color:#066;
border-radius:4px;
border:1px solid #069;
display:inline-block;
color:#fff;
font-family:arial;
font-size:11px;
font-weight:bold;
padding:3px 5px;
text-decoration:none;
text-shadow:1px 0px 0px #6c79b7;
cursor:pointer;
}

/* ~~ discount text ~~ */
div.allproddiscounts{
	font-size: 1.1em;
	color:#A4D664;
	width:90%;
	margin-bottom:2px;
	float:left;
}

span.discountsapply{
	color:#669900;
	font-weight:bold;
}
div.proddiscounts{color:#B00000 ;
	font-weight:bold;}
/* ~~ manufacturer textn ~~ */
div.prodmanufacturer{
	color:#666;
	padding:6px;
}

/* ~~ sku text ~~ */
div.prodsku{
	color:#666;
	padding:6px;
}

/* ~~ product image ~~ */
div.prodimage{
	padding: 5px;
	text-align:center;
}

/* ~~ product name ~~ */
div.prodname{
	padding:2px;
	font-size: 0.8em;
	text-align:left;
	font-weight: bold;
	height:30px;
   line-height:15px;
   overflow:hidden;
}

/* ~~ product ratings ~~ */
div.prodrating{
	padding-left:4px;
}

/* ~~ number of products in stock ~~ */
div.prodinstock{
	padding:4px;
	color:#666;
}

/* ~~ the product description ~~ */
div.proddescription{
}

/* ~~ product options ~~ */
div.prodoptions{
	padding:2px;
	margin-left:2px;
	width:220px;
	float:left;
	border: 1px solid #ccc;
	background:#fff;
}

select.prodoption{
	font-size: 0.7em;
	width:130px;
	float:right;
	margin:6px;
}

span.prodoption{
	font-size: 0.8em;
	padding: 2px;
}

div.optiontext{
	padding: 2px;
	font-size: 0.9em;
	width: 70px;
	float:left;
	margin:2px;
}

div.option{
	padding: 0px;
	float:left;
}

/* ~~ the list price ~~ */
div.listprice{
	padding: 0px;
	text-align:left;
	font-size: 0.8em;
	width:220px;
	float:left;
}
.yousave{
	color:#f30;
	font-weight:bold;
	font-size:1em;
	}
/* ~~ tohe main price display ~~ */
div.prodprice{
	padding: 2px;
	font-size: 0.9em;
	font-weight:bold;
	text-align:center;
	float:left;
	width:220px;
	color: #069;
}

/* ~~ the alternative currency display ~~ */
div.prodcurrency{
	padding: 2px;
	text-align:center;
	float:left;
	width:220px;
	font-size: 0.8em;
}

/* ~~ the add to cart button ~~ */
div.addtocart{
	text-align:center;
	padding-top:6px;
	float:left;
	width:220px;
}


/* ~~ the notify when back in stock button ~~ */
.notifystock{
	text-align:center;
	padding-top:6px;
	float:left;
	width:220px;
}

/* ~~ the configure button ~~ */
.configbutton{
	text-align:center;
	margin-top:6px;
}

/* ~~ the out of stock message ~~ */
div.outofstock{
	text-align:center;
	padding-top:6px;
	font-weight:bold;
}

/* ~~ the product id display ~~ */
.prodid {
	background: #A4D664;
	color:#333;
	padding:6px;
	text-align:center;
	font-size: 1.1em;
}

/* ~~ the multi option display ~~ */
div.multioptiontext{
	width:180px;
}

/* ~~ the pagination navigation ~~ */
div.pagenums{
	text-align:center;
	float:left;
	padding:10px;
}

/* The detail page 
-------------------------------------*/
div.detailimage{
	float:left;
	padding:0.5em;
}
 
.detailid {
	color:#069;
	width:45%;
	float:right;
	padding-bottom:0px;
	font-size: 0.7em;
	text-align: left;
}

.detailmanufacturer{
	float:right;
	width:45%;
}

.detailinstock{
	float:right;
	width:45%;
	border-bottom:1px #ccc dotted;
}

.detailname {
	color:#666;
	padding:0px;
	width:45%;
	float:right;
	font-size: 0.5em;
}

.detaildiscounts{
	color:#B00000;
	font-weight:bold;
	font-size: 0.8em;
	float:right;
	width:45%;
}

span.detaildiscountsapply{
	color:#669900;
	font-weight:bold;
	padding-left: 0px;
}

div.detaildescription{
	font-size: 0.8em;
	margin-top:5px;
	float:left;
	padding-left:6px;
	padding-top:4px;
	border:1px #ccc dotted;
}

.detaillistprice{
    padding-top: 0.6em;
	text-align:left;
	font-size: 0.7em;
	float:right;
	width:45%;
}

div.detailprice{
	font-size: 1.2em;
	font-weight:bold;
	text-align:left;
	float:right;
	width:45%;
	color:#690;
	padding-top:0.2em;
	border-bottom:2px #ccc dotted;
}

div.detailcurrency{
	padding-top: 6px;
	font-size: 0.9em;
	text-align:center;
	float:left;
	width:45%;
}

.detailoptions{
	padding: 6px;
	float:left;
	font-size: 0.8em;
	width:300px;
	text-align:right;
	color:#666;
}

select.detailprodoption{
	font-size: 0.9em;
	float:right;
	width:200px;
	margin:6px;
	color:#666;
}

.detailoptiontext{
	padding: 6px;
	float:left;
}

div.review{
	width:90%;
}

.previousnext{
	padding-top:10px;
	padding-bottom:6px;
	float:right;
	width:45%;
	text-align:center;
	font-size: 0.7em;
}

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

div.detailquantity{
	float:right;
	width:45%;
	color:#666;
}

div.detailquantitytext{
	margin:4px;
	float:left;
	width:20%;
	text-align:left;
	font-size: 0.7em;
}

div.detailquantityinput{
	margin:4px;
	float:left;
	width:50%;
	text-align:left;
}

div.detailaddtocart,.detailoutofstock{
	margin:4px;
	float:right;
	width:45%;
	text-align:center;
	border-bottom:2px #ccc dotted;
	padding-bottom:10px;
}

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

div.navdesc{
	padding-top:10px;
}

/* ~~ the cross selling display ~~ */
.csproduct{
	float:left;
	width:150px;
	height: 250px;
	font-size: 0.6em;
	
	
	
}

.csprodname {
font-size: 10px;
font-weight: bold;

}

.csprodimage {
width: 90px;

}

p.cstitle{
float:left;
width:100%
}

/* ~~ spry tab cross selling display ~~ */
.reltabimagebox{width: 30%;}

img.reltabimage {
padding:1em;
float: left;

}
.reltabname{width: 65%;
float:left;
padding-top: 1em;
font-weight: bold;


}
.reltabdescription{
float:left;
width: 70%;
margin-bottom: 60px;
}
/* The category page 
-------------------------------------*/
div.category{
	width:350px;
	height:250px;
	float:left;
	color:#666;
}

/* ~~ the category image ~~ */
div.catimage{
	width:130px;
	height:230px;
	float:left;
}

/* ~~ the category description ~~ */
div.catdesc{
	padding:4px;
	font-size: 0.8em;
}

/* ~~ the category name ~~ */
div.catname{
	margin-top:2px;
	font-weight: bold;
	text-transform: uppercase;
}

/* ~~ the category discount text ~~ */
.catdiscounts, .allcatdiscounts{
	padding-left:5px;
	font-weight:bold;
	color:#669900;
}

/* ~~ the category header ~~ */
.categorymessage{
	padding-left:5px;
	padding-top:6px;
	font-size: 1.1em;
}
/*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{
	width:660px;
	text-align:center;
}

div.homecat1{
	width:204px;
	float:left;
	margin:8px;
}

div.homecat2{
	width:204px;
	float:right;
	margin:8px;
}

div.homecat3{
	width:204px;
	float:right;
	margin:8px;
}

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

div.homecatwide1 h3, div.homecatwide2 h3, div.homecatwide3 h3, div.homecatwide4 h3 {
	color: #066;
	display: block;
	width: 218px;
	height: 33px;
	margin-top: 230px;
	padding-top: 5px;
	background-color:#fff;
	font-size: 0.9em;
	}

div.homecatwide1 a.link, div.homecatwide2 a.link, div.homecatwide3 a.link, div.homecatwide4 a.link {
	color: #fff;
	}
div.homecatwide1{
	width:218px;
	height: 300px;
	float:left;
	margin:3px 3px 3px 11px;
	border: 2px solid #066;
	background-image: url(images/homecatwide1.jpg);

border-top-left-radius: 40px;
-moz-border-radius-topleft: 40px;
-webkit-border-top-left-radius: 40px;
border-bottom-right-radius: 40px;
-moz-border-radius-bottomright: 40px;
-webkit-border-bottom-right-radius: 40px;

}

div.homecatwide2{
	width:218px;
	height: 300px;
	float:left;
	margin:3px 3px 3px 6px;
	border: 2px solid #066;
	background-image: url(images/homecatwide2.jpg);
	
	 border-radius: 40px;
-moz-border-radius: 40px;
-webkit-border-radius: 40px;

}
div.homecatwide3{
	width:218px;
	height: 300px;
	float:left;
	margin:3px 3px 3px 6px;
	border: 2px solid #066;
	background-image: url(images/homecatwide3.jpg);
	
	 border-radius: 40px;
-moz-border-radius: 40px;
-webkit-border-radius: 40px;

}


div.homecatwide4{
	width:218px;
	height: 300px;
	float:right;
	margin:3px 11px 3px 3px;
	border: 2px solid #066;
	background-image: url(images/homecatwide4.jpg);
	
border-top-left-radius: 40px;
-moz-border-radius-topleft: 40px;
-webkit-border-top-left-radius: 40px;
border-bottom-right-radius: 40px;
-moz-border-radius-bottomright: 40px;
-webkit-border-bottom-right-radius: 40px;

}

#wrapper2 {
	display: none;
}


/* Soft cart 
-------------------------------------*/
input.sccheckout{
box-shadow: 0px 1px 4px 0px #BCC8DC;
background-color:#066;
border-radius:4px;
border:1px solid #069;
display:inline-block;
color:#fff;
font-family:arial;
font-size:11px;
font-weight:bold;
padding:3px 5px;
text-decoration:none;
text-shadow:1px 0px 0px #6c79b7;
cursor:pointer;
}



div.scprodsadded, div.sccartitems{
}

div.scprice{

}

div.sccarttotal{
}


/* 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) {
	
#topcontainer .box {
	width:750px;
	

}



.texttopmid {
	display:none;
	
}	


#container{
	width: 750px;
	background-image: url(images/bg750.gif);
	background-repeat: repeat-y;
	margin-top: 0.3em;
}
#wrapper{
	width:750px;
}
#wrapper2 {
	display: block;
	width: 100%;
}

/* ~~ Content wide section ~~ */
#contentwideindex{
	width: 730px;
	margin:0 auto;

}

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

#footer{
	clear: both;
	background-color: #2d9718;
}

div.footer1{
	clear: both;
	background-color: #2d9718;
	background-image: url(images/ftr750.jpg);
	width:748px;
	height:35px;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-image: url(images/ftrbg750.gif);
	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;
	background-image: url(images/ftrbtm750.gif);
	width:750px;
	height:35px;
	clear: both;
}

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


.search-box{
	width: 235px;
}

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

div.homecatwide1 h3, div.homecatwide2 h3, div.homecatwide3 h3, div.homecatwide4 h3 {
width: 175px;
	}

div.homecatwide1 a.link, div.homecatwide2 a.link, div.homecatwide3 a.link, div.homecatwide4 a.link {
	
	}
div.homecatwide1{
	width:175px;
	float:left;
	margin:1px;

}

div.homecatwide2{
	width:175px;
	height: 300px;
	float:left;
	margin:1px;
	

}
div.homecatwide3{
	width:175px;
	float:left;
	margin:1px;
	

}


div.homecatwide4{
	width:175px;
	height: 300px;
	float:left;
	margin:1px;
	
}


/* The product page
-------------------------------------*/
div.prodfilter{
}
	

div.prodfilterbar{
	width: 600px;
}

div.product{
	width:160px;
	height:280px;
	padding-bottom:0px;
}
div.prodimage{
	padding: 5px;
	text-align:center;
}
div.prodname{
	padding:0px;
	font-weight: bold;
	font-size: 0.8em;
}

div.prodnavigation{
	width:300px;
}

div.checkoutbutton{
}

div.allproddiscounts{
	width:90%;
}

div.prodoptions{
display:none;
}

select.prodoption{
	display:none;
}

div.optiontext{
	display:none;
}

div.option{
	display:none;
}

div.listprice{
	width:130px;
	font-size: 0.6em;
	padding: 0;
	text-align: center;
}
.yousave{font-size: 1.2em;}

div.prodprice{
	width:130px;
}


div.prodcurrency{
	width:130px;
}

div.addtocart{
	display:none;
}

.notifystock{
	width:130px;
}

div.multioptiontext{
	width:130px;
}
/* The detail page 
-------------------------------------*/
div.detailcheckoutbutton{
	
}

.detailid {
width:90%;
float: left;
}

.detailimage {
	margin: auto 0;
}

.detailname {
width:90%;
float: left;
}

.detailmanufacturer{
}

.detaildiscounts{
width:90%;
float: left;
}

.detailinstock{
width:90%;
float: left;
}

.detaillistprice{
width:90%;
float: left;
}

div.detailprice{
width:90%;
float: left;
}

div.detailcurrency{
width:90%;
float: left;
}


.detailoptions{
float:left;
width:90%;
float: left;
}

select.detailprodoption{
float:right;
width: 210px;


}

.detailoptiontext{
float:left;
width:220px;

text-align:left;

}
.previousnext{
width:90%;
float: left;

}

div.emailfriend{
width:90%;
float: left;
}

div.detailquantity{
width:90%;
float: left;

}

div.detailquantitytext{
width:50px;
text-align:left;


}

div.detailquantityinput{
float:left;
}

div.detailaddtocart,.detailoutofstock{

width:90%;
float: left;
}

.detailnotifystock{
}

div.category{
	width:470px;
}

div.review{
	float:left;
	width:470px;
}

div.navdesc{
	padding-top:10px;
}



/* The category page 
-------------------------------------*/
div.category{
	width:130px;
	float: left;
	padding-right: 2em;
	padding-left: 0.5em;
}

div.catimage{
	width:130px;
height: auto;
	
}

div.catdesc{
	display:none;
}

div.catname{
	margin-top:10px;
}

.catdiscounts, .allcatdiscounts{
	padding-left:5px;
	font-weight:bold;
	color:#669900;
}

.categorymessage{
	padding-left:5px;
	padding-top:6px;
	font-size: 1.1em;
}



/*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;
}

div.homecat3{
	display:none;
}

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) {
	
#topcontainer {
	height: 200px;
}
#topcontainer .box {
	width:468px;
	

}	
#topcontainer .login {
	display:none;
}

#wrapper{
	width:468px;
}
p.address{
	font-size: 0.5em;
	padding-top:4px;
}


#container{
	width: 468px;
	background-image: url(images/bg468.gif);
	background-repeat: repeat-y;
}

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

#header .coname {
	width:316px;
}

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

div.tlinks{
    width:100%;
}

div.tnote{
	float:right;
}

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

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

/* ~~ 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;
}

/* ~~ Content wide section ~~ */
#contentwideindex{
	width: 450px;
	margin:0 auto;

}

p.infoimage {display:none;}


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

#footer{
	clear: both;
	background-color: #2d9718;
}

div.footer1{
	clear: both;
	background-color: #2d9718;
	background-image: url(images/ftr468.jpg);
	width:466px;
	height:35px;
}

#footer2{
	clear: both;
	background-color: #fff;
	background-image: url(images/bg468.gif);
	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;
	font-weight: bold;
}

.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;
}

div.end{
	background-color: #fff;
	background-image: url(images/ftrbtm468.gif);
	width:468px;
	height:35px;
	clear: both;
}

.search-box{
	width: 235px;
}

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





div.homecatwide1 h3, div.homecatwide2 h3, div.homecatwide3 h3, div.homecatwide4 h3{
width:175px;
background: #fff;
margin: auto 0;
padding:2px;
height:28px;
text-align:center;
}
	
div.homecatwide1{ 
background: #fff;
	width:180px;
	height:32px;
	border-radius: 0px;
	margin: 10px 20px 10px 20px;
	

}

div.homecatwide2{
  background: #fff;
	width:180px;
	height:32px;
	border-radius: 0px;
	margin: 10px;
	

}
div.homecatwide3{
	  background: #fff;
	width:180px;
	height:32px;
	border-radius: 0px;
	margin: 10px 20px 10px 20px;
	

}


div.homecatwide4{
	  background: #fff;
	width:180px;
	height:32px;
	border-radius: 0px;
	margin: 10px;
	
}

/* ~~ promo overlay ~~ */
.specialimage{
position: relative;
right:10px;
margin-left:-50px;
top:-40px;
z-index: 10;
opacity: 0.8;

}

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

div.prodfilterbar{
	display:none;
}

div.product{
	width:130px;
	height: 300px;
	margin-left:0px;
}
div.prodname{
	padding:0px;
	font-size: 0.8em;
}

div.prodnavigation{
	width:270px;
	margin-left:13px;
}

div.checkoutbutton{
}

div.allproddiscounts{
	width:90%;
	margin-left:13px;
}

div.prodoptions{
	width:416px;
}

select.prodoption{
	width:266px;
}

div.optiontext{
	width: 120px;
}

div.option{
	padding: 0px;
}

div.listprice{
	width:130px;
	text-align: center;
	
}

div.prodprice{
	width:130px;
	font-size: .8em;
}

div.prodcurrency{
	width:130px;
}

div.addtocart{
	width:433px;
}

.notifystock{
	width:130px;
}

div.multioptiontext{
	width:130px;
}


/* The detail page 
-------------------------------------*/
div.detailcheckoutbutton{
	width:90px;
}

div.proddetail{
}

.detailid {
	float:left;
	width:90%;
}

.detailimage {
	text-align: center;
	width:440px;
	margin-left:6px;
}

.detailname {
	float:left;
	width:90%;
}

.detailmanufacturer{
	float:right;
	width:200px;
}

.detaildiscounts{
	float:left;
	width:90%;
}

.detailinstock{
	float:right;
	width:196px;
}

.detaillistprice{
	width:433px;
}

.detaildescription{
	width:424px;
	margin-left:2px;
}

div.detailprice{
	width:95%;
	float:right;
	text-align: right;
	padding-right: 1em;
}

div.detailcurrency{
	width:433px;
}

select.detailprodoption{
	
width:300px;
	float:right;
}

.detailoptions{
width: 430px;
}
.detailoptiontext{
float:left;
text-align:left;

}
.previousnext{
	width:433px;
}

div.emailfriend{
	display:none;
}

div.detailquantity{
	width:300px;
}

div.detailquantitytext{
	width:60px;
	float:left;
}

div.detailquantityinput{
	width:40px;
	float:left;
}

div.detailaddtocart,.detailoutofstock{
	width:433px;
}

.detailnotifystock{
	width:433px;
}

div.category{
	width:433px;
}

div.review{
	float:left;
	width:433px;
	margin-left:12px;
}

span.review{
	margin-left:12px;
}

div.navdesc{
	padding-top:10px;}

.csproduct{
	float:left;
	width:125px;}




/* The category page 
-------------------------------------*/
div.category{
	width:170px;
	float:left;
	margin-left:5px;
	height: 12em;
}

div.cathead{
	width:420px;
	float:left;
	margin-left:16px;
}

div.catimage{
	width:170px;
	height: auto;
	float:left;
}

div.catdesc{
}

div.catname{
	margin-top:0px;
	width: 95%;
	font-size: 0.8em;
}

.catdiscounts, .allcatdiscounts{
	padding-left:5px;
	font-weight:bold;
	color:#669900;
	padding-left:12px;
}

.categorymessage{
	padding-left:12px;
	padding-top:6px;
	font-size: 1.1em;
}


/*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:440px;
	margin:2px;
}

div.homecat1{
	width:200px;
}
div.homecat2{
	width:200px;
}

div.homecat3{
	display:none;
}

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) {
	
#topcontainer .box {
	width:316px;
	

}
#topcontainer .hdrRtop {
	line-height: 20px;
	float:right;
	padding-top: 20px;
	padding-right:0px;
}	
p.address{
	font-size: 0.5em;
	padding-top:2px;
}

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

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

#header .coname {
	width:316px;
	padding-left:0px;	
}

#header .hdrR {
	display:none;
}

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

.leftmenu{
	display:none;
}

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

.lefticon{
	display:none;
}

.menutop{
	display:none;
}

.leftend{
	background-image:  url(images/leftend320.jpg);
}
	
.rightend{
	background-image:  url(images/rightend320.jpg);
}




#content{
	padding-top: 0em;
	margin: 0 3em 0 0;
	width:312px;
}
/* ~~ Content wide section ~~ */
#contentwideindex{
	width: 312px;
	margin:0 auto;

}

h2{
	margin-left:12px;
}

#footer{
	clear: both;
	background-color: #2d9718;
}
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;
}

div.homecatwide1, div.homecatwide3{ 
	margin: 10px;
	

}
/* ~~ promo overlay ~~ */
.specialimage{
position: relative;
right:44px;
margin-left:-50px;
top:-44px;
z-index: 10;
opacity: 0.8;
}

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

div.prodfilterbar{
	display:none;
}

 img.prodimage{width:80px;}

div.product{
	width:90px;
	height:150px;
	margin-left:4px;
	font-size: 0.6em;
}
div.prodname{
display:none;}

div.prodnavigation{
	width:290px;
	margin-left:2px;
}

div.checkoutbutton{
	display:none;
}

div.allproddiscounts{
	width:300px;
	margin-left:6px;
}

div.prodoptions{
	display:none;
}

select.prodoption{
	display:none;
}

div.optiontext{
	display:none;
}

div.option{
	display:none;
}

div.listprice{
	display:none;
}

div.prodprice{
    padding: 0px;
	width:90px;
	font-size: 1em;
	text-align: left;
}

div.prodcurrency{
	display:none;
}

div.addtocart{
	display:none;
}

.notifystock{
	display:none;
}

div.multioptiontext{
	display:none;
}

div.pagenums{
	width: 282px;
	padding:2px;
}
/* The detail page 
-------------------------------------*/
div.detailcheckoutbutton{
}

div.proddetail{
	width:306px;
}

.detailid {
	float:right;
	width:306px;
}

.detailimage {
	float:left;
	width:306px;
	margin-left:6px;
}

.detailname {
	float:right;
	width:300px;
	margin-left:12px;
}

.detailmanufacturer{
	float:right;
	width:300px;
	margin-left:12px;
}

.detaildiscounts{
	float:right;
	width:300px;
	margin-left:12px;
}

.detailinstock{
	float:right;
	width:300px;
	margin-left:12px;
}

.detaillistprice{
	width:300px;
}

.detaildescription{
	width:300px;
	margin-left:6px;
}

div.detailprice{
	width:300px;
}

div.detailcurrency{
	width:300px;
}

select.detailprodoption{
width: 250px;
float: left;
}

.detailoptions{
width: 300px;
}

.previousnext{
	width:300px;
}

div.emailfriend{
	display:none;
}

div.detailquantity{
	width:150px;
	float: left;
	margin-left: 10px;
}

div.detailquantitytext{
	width:80px;
	float:left;
}

div.detailquantityinput{
	width:50px;
	float:right;
}

div.detailaddtocart,.detailoutofstock{
	width:300px;
}

.detailnotifystock{
	width:300px;
}

div.category{
	width:300px;
}

div.review{
	float:left;
	width:300px;
	margin-left:4px;
}

span.review{
	margin-left:4px;
}

div.navdesc{
	padding-top:10px;
	width:296px;
}

.csproduct{width:100px;
height: 200px;}
.csprodname{display:none;}

/* The category page 
-------------------------------------*/
div.category{
	width:110px;
	float:left;
	margin-left:1px;
}

div.catnavigation{
	width:302px;
}

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

div.catdesc{
	display:none;
}

div.catname{
    font-size: 0.8em;
}

.catdiscounts, .allcatdiscounts{
	padding-left:5px;
	font-weight:bold;
	color:#669900;
	padding-left:6px;
}

.categorymessage{
	display:none;
}

/*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;
}

div.homecats{
	width:308px;
	margin:2px;
}

div.homecat1{
	width:200px;
}
div.homecat2{
	display:none;
}

div.homecat3{
	display:none;
}

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

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

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

}
