﻿/* ~~ This the css file for the Responsive Design of Virtual Monochrome from Ecommerce Templates.
The first section correponds to the maximum width version of 1280 pixels ~~ */
@charset "utf-8";
/*	THESE INCLUDES PREVENT CSS OVERWRITTEN BY UPDATERS	
div.co2newacctbutton*/
.co2newacctbutton {display:none; }
.cdformtnewaccount{display:none; }
div.cdformnewaccount {display:none; }
div.cartheader {display:none; }

div.searchedfor {color:red; font-weight:bold; font-size:16px; width:100%; text-align:center;} 

div.savepricedisp{
	color:#DA6A1E;
}

.custom-dialog {
    /*border: none;*/
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    width: 30%;
}
.close-btn {
    cursor: pointer;
    background: none;
    border: none;
    font-weight: bold;
    background-color:#000;
    color:#fff;
}
.filter-button {
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    text-align:center;
}
#openFilter {
    background-color: #FF0000;
    color: #fff;
    padding: 10px; /* Optional: adds space inside the button */
    cursor: pointer;
}

#openFilter:hover {
    color: #FFF;
    background-color: #000;
    text-decoration: underline;
}




div.socialmediabuttons {
	float:left;
	width:55%;
}
div.detailcustom1{
	float:left;
	width:55%;
}
div.detailid, div.detailsku, div.detaildateadded, div.detailmanufacturer {
    width: 53%;
    /*float: right;*/
    margin: 6px 1%;
    color: #555;
    clear: right;
    font-weight: bold;
}
/* Backdrop/Overlay styling */
#p65-modal::backdrop {
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
}
figure {
	text-align:center;
}
/* Modal Container */
#p65-modal {
    border: none;
    border-radius: 12px;
    padding: 0;
    max-width: 500px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

.p65-content {
    padding: 24px;
    background: #fff;
}

.p65-body {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.p65-svg {
    flex-shrink: 0;
}

.p65-title {
    margin: 0 0 12px 0;
    font-size: 1.25rem;
    color: #1a1a1a;
    border-bottom: 1px solid #eee;
    padding-bottom: 8px;
}

.p65-main-text {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #333;
}

.p65-footer-text {
    font-size: 0.85rem;
    margin-top: 15px;
    color: #666;
}

.p65-link {
    color: #0066cc;
    text-decoration: none;
    border-bottom: 1px solid #0066cc;
}

/* Action Button */
.p65-action-area {
    margin-top: 24px;
    text-align: right;
}

#close-p65 {
    background: #000;
    color: #fff;
    border: none;
    padding: 10px 24px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    transition: opacity 0.2s;
}

/* Trigger Link */
.p65-trigger {
    color: #0066cc;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.9rem;
    float: left;
}

div.socialmediabuttons > div {
    display: inline-block;
    padding-right: 5px;
    vertical-align: top;
    float: left;
}
a.smarty-choice-override:link {
    float: right;
    color: #FFF;
}
ul.ectmenu1  {
	margin: 0;
	padding: 0;
}

ul.ectverticalmenu2 li.ectmenuhassub1 > a::after{
  content: "\f107";
  float: right;
  padding-right:2px;
  border: none;
  font-family: 'FontAwesome';
 }

ul.ectverticalmenu2 > li, ul.ectverticalmenu3 > li {
    margin-bottom: .5px;
}

.leftside li.ectsub a {
    padding: 3px 0 3px 8px;
    color: #000;
    display: block;
    background-color:#ccc;
}

.leftside li.ectsub.ectraq2 a{
    padding: 3px 0 3px 8px;
    color: #000;
    display: block;
    background-color:#FFF;
}

.leftside li.ectsub.ectraq2 a:hover {
    padding: 3px 0 3px 8px;
    color: #FFF;
    display: block;
    background-color: #000;
}

li.ectraq1 > a::before{
content:"\2192";
margin-right:4px;
}
li.ectraq2 > a::before{
content:"\2014\2192";
margin-right:4px;
}


div.cdformmailingd{
	color:blue;
}

div.cdformterms{
	color:red;
}

div.moreattributes {
background-color: rgba(184,184,184, .8) !important;
color: #000;
font-size: 12px;
font-weight: bold;
padding: 1px;
border: 1px solid #999 !important;
}

div.ectpacount {
font-size: 0.9em;
color: #666;
}

div.ectpatgrp {
background-color:#F0F0F0;
border-bottom: 1px solid #000;
margin-bottom: 12px;
padding-bottom: 6px;
}

div.ectpatcb {
    margin: 3px 0px;
}

div.ectpattitle {
    margin-bottom: 6px;
	font-size: 14px;
}

div.mcLNitems {
	display: none;
}
div.scwrap, div.qbuywrapper, div.iuwrap {
	margin: 5vh auto 0 auto;
	background: #FFF;
	width: 75%;
	max-width: 75%;
	padding: 6px;
	border-radius: 5px;
	box-shadow: 1px 1px 5px #333;
	overflow: auto;
	max-height: 90vh;
	box-sizing: border-box;
	text-align: left;
}
div.scprodsadded {
	padding: 3px;
	border-top: 1px solid #567CBB;
	clear: both;
	text-align: center;
}
div.scimgproducts {
	text-align: center;
}
div.scprodname {
	padding: 3px;
	text-align: left;
	color: #000;
}
div.scprice {
	padding: 3px;
	text-align: left;
	clear: left;
	background: #f1f1f1;
	border-top: 1px dotted #567CBB;
	font-weight: bold;
	color: red;
	background-color: #fff;
}
div.sccarttotal {
	padding: 3px;
	text-align: right;
	background: #f1f1f1;
	border-top: 1px dotted #567CBB;
	font-weight: bold;
	color: red;
	background-color: #fff;
}
div.sccheckout {
	bottom: 5px;
	left: 75%;
}
div.scwrap {
	position: relative;
}
div.sclinks {
	text-align: center;
	color: #fff;
}
div.scrproduct {
	min-height: 250px;
	width: 31%;
	display: inline-block;
	vertical-align: top;
	margin: 4px;
	border: 1px #333 solid;
}
div.scrprodprice {
	color: red;
}
div.scrproduct div {
	text-align: center;
	padding: 0px;
	margin: 0px;
}
div.scrimage {
	border: none;
	padding: 4px;
	min-height: 116px;
}
div.scrprodid {
	background-color: #000;
	color: #fff;
}
div.scrprodname {
	background: transparent !important;
}
div.scrprodname a.ectlink {
	font-size: 12px;
	color: #000;
	text-decoration: none;
}
div.scrprodname a.ectlink:visited {
	font-size: 12px;
	color: #000;
	text-decoration: none;
}
div.scrprodname a.ectlink:active {
	font-size: 12px;
	color: #000;

	text-decoration: none;
}
div.scrprodname a.ectlink:hover {
	color: #ff0000;
	text-decoration: none;
}
div.prodid {
	background-color:#000;
	color: #FFF;
}
div.prodimage {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	width: 100%;
	min-height: 215px;
	align-items: center;
	margin: 0 0 2px 0;
	padding: 6px;
	border: 1px solid gray;
	box-sizing: border-box;
}
div.prodimage div.imagenavigator {
	display: inline;
}
div.prodprice {
	font-weight: bold;
	text-align: center;
	color: red;
}
img.prodimage {
	max-height: 160px;
}
div.prodname {
	background: #FFF;
	color: #000;
	min-height: 60px;
}
div.prodname a:link, div.prodname a:visited {
	color: #ff0000;

	font-weight: normal;
	font-size: 14px;
}
div.prodname a:link {
	color: #ff0000;

	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.prodname a:visited {
	color: #ff0000;

	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.prodname a:active {
	color: #ff0000;

	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.prodname a:hover {
	color: #000;
	background-color: #FFF;
	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.proddescription {
    display: none;
    /* min-height: 100px; */
}
div.csprodimage div.csimagenavigator {
	display: inline;
}
div.csimagenavigator > input[type=button], div.csimagenavigator > button {
    font-size: 8px;
    padding: 4px 6px;
    margin: 0 3px;
}
div.csprodimage {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	width: 100%;
	min-height: 215px;
	align-items: center;
	margin: 0 0 2px 0;
	padding: 6px;
	border: 1px solid gray;
	box-sizing: border-box;
}
div.csprodprice {
	font-weight: bold;
	text-align: center;
	color: red;
}
span.pagebarquo {
	display: none;
}
div.pagenumbers > a.ectlink:first-child::after {
	content: " First";
}
div.pagenumbers > a.ectlink:last-child::before {
	content: " Last ";
}
div.pagenumbers {
	color: #fff;
	float: left;
	width: 100%;
	margin: 15px auto;
	padding: 10px 0;
	text-align: center;
	clear: none;
}
/* ~~ Main settings and resets ~~*/
body {
	margin: 0px;
	font: 100%/1.5 Arial, serif;
	color: #333;
	line-height: 1.6;
/* background: url(../images/bg.gif) #fff repeat-x; */
}
div.chome-phone {
	text-transform: uppercase;
	font-size: 26px;
	font-weight: bold;
	color: #000;
	display: inline-block;
	text-align: center;
	width: auto;
}
a.chome-phone:link {
	color: #ff0000;
	text-decoration: none;
}
a.chome-phone:visited {
	color: #ff0000;
	text-decoration: none;
}
a.chome-phone:active {
	color: #ff0000;
	text-decoration: none;
}
a.chome-phone:hover {
	color: #000;
	text-decoration: none;
}
ul {
	margin: 0;
	/* padding: 0; */
}
img {
	border: 0px;
}
.clr {
	clear: both;
	line-height: 0;
	font-size: 0;
	height: 0;
	border: none;
}
/* ~~ Social media icons ~~*/
.topsocial {
	width: 100%;
	height: 22px;
	/*background-color: #000;*/
	float: left;
	/*border-bottom: 1px solid #ccc;*/
	color:#000;
}
/* ~~ Top right navigation ~~*/
.toptextlinks {
	font-size: 0.8em;
}
/* ~~ Container ~~*/
#maincontainer {
	width: 1280px;
	margin: 0 auto;
}
/* ~~ The header section ~~*/
#header {
	padding: 6px 0;
}
#header .logo {
	padding-top: 3px;
	padding-bottom: 2px;
}
#header .hdrR {
	line-height: 16px;
	text-align: right;
	margin-top: 18px;
	float: right;
	width: 60%;
}
#header .hdrR p {
	color: #60a1de;
	padding: 10px 0 0 0px;
}
#header .logo {
	float: left;
}
.l {
	float: left;
}
/* Mega Menu */
nav.ectmegamenu {
	background-color: #000;
	font-weight:bold;
}
nav.ectmegamenu > ul > li {
	background-color: #000;
	font-size: 0.9em;
	text-transform: uppercase;
}
nav.ectmegamenu > ul > li > a, span.megamobiletext {
	color: #FFF;
}
nav.ectmegamenu > a:hover {
	color: #000;
	text-decoration: underline;
}

div.slidercaption {
	bottom: 10px;
	top: auto;
	color: #FFF;
}
img.csprodimage {
	max-height: 160px;
}
.ectmegamenu > ul > li > ul.normal-sub > li a, nav.ectmegamenu > ul > li > ul > li a, nav.ectmegamenu > ul > li > ul > li > ul > li a {
	border-bottom: 1px solid #ff0000;
	color:#FFF;
	background-color:#000;
}
.ectmegamenu > ul > li, .ectmegamenu > ul > li:hover {
	background-color: #ff0000;
}
nav.ectmegamenu > ul > li > a:hover {
	color: #FFF;
	background-color: #ff0000;
}
.ectmegamenu > ul > li > ul > li a:hover,
.ectmegamenu > ul > li > ul > li > ul > li a:hover{
background-color:#ff0000;
color:#FFF;
}


.ectmegamenu > ul > li > ul.normal-sub {
    width: 200px;
    left: auto;
	margin: 0;
    padding: 0;
}}
.ectmegamenu > ul > li > ul {
    background-color: #000;
}

li.ectmega-is-open > a {
	color: #FFF !important;
}
.sliderarrow {
	color: #ff0000;
}
.ectmegamenu > ul > li > ul.normal-sub > li a, .ectmegamenu > ul > li > ul > li a, .ectmegamenu > ul > li > ul > li > ul > li a {
    color: #FFF;
    border-bottom: 1px solid #333;
    padding: 12px;
    /* box-sizing: border-box; */
    width: 100%;
}




/*Internal store naviagtion*/
a.ectlink:link {
	color: #000;

	text-decoration: none;
}
a.ectlink:visited {
	color: #000;

	text-decoration: none;
}
a.ectlink:active {
	color: #000;

	text-decoration: none;
}
a.ectlink:hover {
	color: #ff0000;
	text-decoration: none;
}
/*Button and form field styles*/
input[type=button].ectbutton, input[type=submit].ectbutton, button.ectbutton {
	background: #000;
	color: #fff;
	font-family: FontAwesome, sans-serif;
	border-radius: inherit;
}
input[type=button].ectbutton:hover, input[type=submit].ectbutton:hover, button.ectbutton:hover {
	/*background:#ff0000;*/
background-color: #ff0000;
	color: #FFF;
	cursor: pointer;
	font-family: FontAwesome, sans-serif;
}
div.proddetaillink input[type=button].detaillink {
	color: #FFF;
	padding: 6px 12px;
	border: 0;
	/* border-radius: 4px; */
	font-family: FontAwesome, sans-serif;
	cursor: pointer;
	font-weight: normal;
	-webkit-appearance: none;
	line-height: normal;
	font-size: 14px;
}






button.ectbutton:hover {
	/*background:#ff0000;*/
	background-color: #ff0000;
	color: #FFF;
	cursor: pointer;
	font-family: FontAwesome, sans-serif;
}

button.detaillink, button.csdetaillink {
	color: #FFF;
	padding: 6px 12px;
	border: 0;
	/* border-radius: 4px; */
	font-family: FontAwesome, sans-serif;
	cursor: pointer;
	font-weight: normal;
	-webkit-appearance: none;
	line-height: normal;
	font-size: 14px;
	width:100%;
}









div.prodaddtocart button.buybutton {
	color: #FFF;
	padding: 6px 12px;
	border: 0;
/* border-radius: 4px; */font-family: FontAwesome, sans-serif;
	cursor: pointer;
	font-weight: normal;
	-webkit-appearance: none;
	line-height: normal;
	font-size: 14px;
}
input.csqbuybutton, input.csdetaillink, button.csconfigbutton {
    width: 100%;
    border: 0;
    margin: 0;
    padding: 6px 0;
}
div.addtocart button.configbutton, div.qbuybutton input[type=button].qbuybutton, div.csaddtocart button.configbutton, div.proddetaillink input[type=button].detaillink, input[type=button].csdetaillink, input[type=button].csqbuybutton {
    vertical-align: middle;
    padding: 6px;
    border: 1px solid transparent;
    -webkit-transition: background-color 0.25s ease-out, color 0.25s ease-out;
    transition: background-color 0.25s ease-out, color 0.25s ease-out;
    /* font-family: "FontAwesome", "Lexend", "Helvetica Neue", Helvetica, Arial, sans-serif; */
    /* font-size: 0.9rem; */
    -webkit-appearance: none;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    display: block;
    width: 100%;
    font-size: inherit;
    border-radius: 0;
    margin: 0;
}
button.buybutton, input[type=button].detaillink, button.detaillink, input.qbuybutton, button.qbuybutton, button.outofstock, button.notifystock, button.configbutton {
    min-height: auto;
}
input.detailbuybutton, button.detailbuybutton, input.detailnotifystock, button.detailnotifystock, input.detailwishlist, button.detailwishlist, button.detailoutofstock {
	width: auto;
    padding: 6px 4px;
    font-size: 16px;
}
input[type=button].ectbutton:disabled, input[type=submit].ectbutton:disabled, button.ectbutton:disabled {
	background: #000;
	color: #FFF;
	cursor: pointer;
	text-shadow: none;
	width: 100%;
}
div.largereviewstars svg.icon, div.smallreviewstars svg.icon {
	fill: #544A4A;
}
input.previmg, input.nextimg, input.detailprevimg, input.detailnextimg {
	border-radius: 4px;
	border: 1px solid #ccc;
	background: #fff;
	margin: 4px;
	font-size: 11px;
	cursor: pointer;
	color: #544A4A;
	padding: 4px;
}
input.previmg:hover, input.nextimg:hover, input.detailprevimg:hover, input.detailnextimg:hover {
	color: #000;
	border: 0px solid #666;
}
div.imagenavigator > input[type=button], div.imagenavigator > button {
    font-size: 8px;
    padding: 4px 6px;
    margin: 0 3px;
}

div.detailprice {
    font-size: 1.5em;
    font-weight: bold;
   /* float: right;
    width: 53%;*/
    margin: 2px 1%;
    color:#ff0000;
}
div.detailinstock {
   /* float: right;
    width: 53%;*/
    margin: 8px 1%;
    font-size: 1.2em;
    color: #297523;
}
div.prodinstock {
    font-size: 1.2em;
    color: #297523;
}




/*mini drop down cart*/
.ectdp_minicartopen img {
	display: none;
}
.ectdp_minicartmainwrapper {
	color: #000;
	background: #FFF;
	font-size: 13px;
	padding-top: 1px;
}
.ectdp_minicartopen {
	background: #FFF;
	padding-top: 0;
	margin-top: 0;
	font-size: 13px;
}
.ectdp_minicartcontainer {
	background: #FFF;
}
/*one line mini login*/
div.minicartoneline1 {
	font-size: 12px;
	float: left;
}
div.minicartoneline2 {
	font-size: 12px;
	float: left;
	padding-top: 2px;
}
div.minicartoneline3 {
	font-size: 12px;
	float: left;
	padding-top: 2px;
}
.minicartoneline > div.minicartoneline3 {
	padding: 1px 3px;
}
div.minicartoneline3 > button {
	/*font-size: 11px;*/
	height: 20px;
	line-height: 9px;
}
/* ~~ Body content ~~*/
#mainwrapper {
	float: left;
	width: 100%;
	background: #fff;
}
#maincontent {
	/*margin-left: 206px;*/
	margin-left: 240px;
	padding: 0px 4px 0px 4px;
	font-size: 0.9em;
	padding-left: 20px;
}
div.store {
	padding: 10px;
}
/* ~~ Orange Color Underline for Menus Etc ~~*/
p.cstitle {
	border-bottom: 1px solid #ff0000;
}
/*div.ectpatgrp {
	border-bottom: 1px solid #ff0000;
} */
div.catnavandcheckout {
	border-bottom: 1px solid #ff0000;
}

/*select.prodfilter, select.prodoption, select.sidefilter, div.ectpatgrp input[type=text], input.minimailsignup[type=text] {
	border: 1px solid #666;
} */

div.csprodname {
	background: #FFF;
	color: #000;
	min-height: 90px;
}
div.csprodname a:link, div.csprodname a:visited {
	color: #ff0000;
	font-weight: normal;
	font-size: 14px;
}
div.csprodname a:link {
	color: #ff0000;
	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.csprodname a:visited {
	color: #ff0000;
	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.csprodname a:active {
	color: #ff0000;
	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.csprodname a:hover {
	color: #000;
	background-color: #FFF;
	text-decoration: none;
	font-weight: normal;
	font-size: 14px;
}
div.catdesc {
	display: none;
}
div.catname {
	background: #FFF;
	color: #000;
}
div.catname a:link, div.catname a:visited {
	color: #ff0000;
	font-weight: bold;
	font-size: 14px;
}
div.catname a:link {
	color: #ff0000;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}
div.catname a:visited {
	color: #ff0000;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}
div.catname a:active {
	color: #ff0000;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}
div.catname a:hover {
	color: #000;
	background-color: #FFF;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}
/* ~~ Left content ~~*/
.lefthand {
	float: left;
	/*width: 200px;*/
	width: 240px;
	margin-left: -1280px;
	background: #fff;
	list-style: none;
	line-height: 18px;
	padding: 0px;
	font-size: 0.8em;
	margin-top: 10px;
	box-sizing: border-box;
}
.leftside ul li {
	list-style: none;
	line-height: 24px;
	padding: .5px;
	/*border-bottom: 1px solid #a82626;*/
}
.leftside li a {
	padding: 3px 0 3px 8px;
	color: #000;
	display: block;
	/*background-color:#E8E8E8;*/
}

.leftside li a:hover {
	background-color:#000;
	color: #FFF;
	text-decoration: none;
}



div.leftside {
	margin-bottom: 6px;
	padding-bottom: 6px;
	box-sizing: border-box;
}

/* ~~ Right content ~~*/
.righthand{
float: right;
width: 200px; 
margin-left: -1280px; 
background: #fff;
list-style:none;
line-height:18px;
padding:0px;
font-size:0.8em;
margin-top:10px;
box-sizing:border-box;
}
.rightside ul li{
list-style:none;
line-height:24px;
border-bottom:1px solid #ff0000;
}
.rightside li a{
padding:3px 0 3px 8px;
display:block;
}
.rightside li a:hover{
background-color:#dbdbdb;
color:#333;
text-decoration:none;
}
div.rightside {
margin-bottom:6px;
padding-bottom:6px;
box-sizing:border-box;
}

div.filtertop {
	font-size: 1.2em;
	font-weight:normal;
	color:#000;
	text-align: center;
	width:96%;
	border-bottom:1px solid #ff0000;
	padding:6px 4px;
	margin-bottom:6px;
	box-sizing:border-box;
}

/* ~~ Footer content ~~*/
.footer1 {
	clear: left;
	width: 100%;
	background: #151515;
	color: #FFF;
/* font-size:0.8em; */
}
#footer {
	clear: left;
	width: 1280px;
	background: #151515;
	color: #FFF;
	margin: 0 auto;
}
#footer a:link {
	color: #fff;
}
#footer a:active {
	color: #fff;
}
#footer a:visited {
	color: #fff;
}
#footer a:hover {
	color: #ff0000;
}
p.menuhead {
	font-size: 16px;
	text-align: right;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
	float: left;
    width: 100%;
    background: #000;
    /* border-right: 1px solid #ccc; */
    /* padding: 15px; */
    text-align: center;
}}
p.copyright {
	font-size: 0.9em;
	text-align: right;
	width: 100%;
}
/* ~~ Main link properties ~~*/
A:link {
	color: #ff0000;

	text-decoration: none;
}
A:visited {
	color: #ff0000;

	text-decoration: none;
}
A:active {
	color: #ff0000;

	text-decoration: none;
}
A:hover {
	color: #000;
	text-decoration: none;
}
/* Top Link Properties */
A.tp:link {
	color: #da6805;
	text-decoration: none;
}
A.tp:visited {
	color: #da6805;
	text-decoration: none;
}
A.tp:active {
	color: #da6805;
	text-decoration: none;
}
A.tp:hover {
	color: #ccc;
	text-decoration: underline;
}
/* ~~ Titles ~~*/
div.menutop {
	font-size: 1.2em;
	font-weight: normal;
	color: #000;
	text-align: center;
	/*width: 96%;*/
	border-bottom: 1px solid #ff0000;
	padding: 6px 4px;
	margin-bottom: 6px;
	box-sizing: border-box;
}
div.prodtop {
	font-size: 1.8em;
	font-weight: normal;
	color : #666;
	padding-left: 2px;
	padding-top: 2px;
	margin-top: 12px;
}
h1 {
	font-size: 1.1em;
	font-weight : bold;
	padding: 5px;
	background-color: #fff;
	color : #000;
	margin: 4px;
	/* border-bottom: 1px solid #ccc;*/
}
div.detailname {
    /*float: right;
    width: 53%;*/
    text-align: left;
    border-top: 5px red solid;
    border-bottom: 5px red solid;
}
div.detailname h1 {
    font-size: 1.1em;
}
/* ~~ Search bar properties ~~*/
div.searchbox {
	width: 100%;
	float: right;
	white-space: nowrap;
}
.search_bg {
	float: left;
	border: 1px solid #d9d8dd;
	padding: 0;
	width: 100%;
	background: #FFF;
	position: relative;
	box-sizing: border-box;
}
.search_text {
	width: 100%;
	border: 0;
	padding: 9px;
	font-family: Arial;
	font-size: 14px;
	font-weight: bold;
	color: #ff0000;

	box-sizing: border-box;
}
.search_button {
	background: url(../images/search_icon.jpg) no-repeat;
	width: 16px;
	height: 16px;
	position: absolute;
	right: 10px;
	border: 0px;
	cursor: pointer;
	margin-top: 8px;
}



/* ~~ Horizontal rule ~~*/
hr {
	height: 0;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #D86807;
}
div.minicartoneline {
	display: inline;
}
/* This is the first breakpoint and is for screen sizes between 980 and 1280 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: 1280px){
#maincontainer {
	width: auto;
}
.lefthand {
	margin-left: -100%;
}
#footer {
	width: 100%;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
	width: 209px;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
    /*float: left;*/
    width: 100%;
    background: #000;
    /* border-right: 1px solid #ccc; */
    /* padding: 15px; */
    text-align: center;
}
}
/* This is the second breakpoint and is for screen sizes between 800  and 1024 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: 1152px){
body {
	background: none;
}
#footer {
	width: 100%;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
	width: 209px;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
    /*float: left;*/
    width: 100%;
    background: #000;
    /* border-right: 1px solid #ccc; */
    /* padding: 15px; */
    text-align: center;
}
.custom-dialog {
    /*border: none;*/
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    width: 40%;
}

div.store {
    padding: 10px;
    width: 100%;
}
div.righthand {
	display:none;
}
}
@media screen and (max-width:800px){
/* ~~ Move header elements ~~*/
.logo {
	width: 98%;
	text-align: center;
}
#header .hdrR {
	float: none;
	text-align: center;
	width: auto;
	margin-right: 0;
}
.hdrR .toptextlinks {
	float: none;
	text-align: center;
	width: auto;
	display: block;
}
div.searchbox {
	width: auto;
	text-align: left;
	height: 46px;
	float: none;
	display: block;
}
div.store {
    padding: 10px;
    width: 100%;
}
div.righthand {
	display:none;
}
}
/* This is the third breakpoint and is for screen sizes between 468 and 690 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:690px){
#maincontent {
	margin-left: 0px;
	border: 0px;
}
#maincontainer {
	width: 94%;
}
/* ~~ Remove left hand menu ~~*/
.lefthand {
	float: right;
	width: 98%;
	clear: both;
}
.custom-dialog {
    /*border: none;*/
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    width: 60%;
}

/* ~~ Reset footer ~~*/
#footer {
	width: 100%;
	clear: both;
}
div.bottomlinks1, div.bottomlinks2 {
	width: 40%;
	float: left;
}
div.bottomlinks3, div.bottomlinks4 {
	float: left;
}
div.righthand {
	display:none;
}
}
/* This is the fourth 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){
#maincontainer {
}
#footer {
	width: 100%;
}
div.bottomlinks1, div.bottomlinks2, div.bottomlinks3, div.bottomlinks4 {
	width: 100%;
	margin-right: 0px;
	text-align: center;
}
.custom-dialog {
    /*border: none;*/
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    width: 80%;
}

p.menuhead {
	text-align: left;
}
}
@media print, screen and (min-width: 40em) {
div.categories > div.category, div.products > div.product, div.csproducts > div.csproduct {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 20%;
	/* flex: 0 0 20%; */
	-webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4);
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4);
	margin: 0.5rem 0;
}
}
@media screen and (min-width: 75em) {
div.categories > div.category, div.products > div.product, div.csproducts > div.csproduct {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 20%;
	/* flex: 0 0 20%; */
	margin: 0.75rem 0;
}
}

