body {
	margin:0;
	padding:0;
	font-family:Verdana,Helvetica,sans-serif;
	/*font-size:14px;*/
	/*font-size:0.875em;*/
	font-size:87.5%;
    /* font-size:100%;     */
}
	
#kjcontainer {
	width:100%;
	margin:0 auto;
	max-width:1440px;
	}

#kjsidebar {
	background-color:#e8e8e8;
	float:left;
	width:150px;
	margin:0;
	padding:0;
	}

#kjsidebar img {
	border:0px;
	margin:0px;
	padding:0px;
	}	

#kjcontentproducts {
	/*used in products and proddetail, not needed? */
	}

div.nomin { 
	border:1px solid #808080;
	padding:10px 4px 0px 4px;
	margin:auto;
	background: #FFE680;
	width:78px;
	height:68px;
	font-size:14px;
	font-weight:bold;
	color:#990000;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	}
	
#kjnews {
	border-collapse:collapse;
	border-spacing: 0px;
	background-color:#e8e8e8;
	text-align:right;
	/*font-size:0.875em;*/
	font-style: normal;
	font-weight: normal;
	text-align: center;
	color: #606060;
	}

.kjnewstext {
	/*font-size:0.875em;*/
	}
	
ul.KJbullets {
	margin-left:0;
	list-style-type:none;
	padding-bottom:10px;
	}
	
.pdmagdir {
	float:right;
	}
	
select.prodoption {
	font-size:8pt;
	}

/*MC announcements */	
.KJmsgbox {
	border-style:solid;
	border-color:#505050;
	border-width:1px;
	padding:10px;
	background-color:#f0f0f0;
	width:80%;
	margin:0px auto;
}

/*MC note in custom quote */	
.KJprodbox 
	{
	border-style:solid;
	border-color:#505050;
	border-width:1px;
	padding:10px;
	background-color:#f0f0f0;
	width:95%;
	margin:0px auto;
}

	
/*For the Sidebar Menu, based on http://www.dynamicdrive.com/style/csslibrary/item/arrow_green_vertical_menu/ */

.arrowgreen{
	width: 150px; /*width of menu*/
	border-style: solid solid none solid;
	border-color: #f00;
	border-width: 0px;
	padding:0px 0px 10px 0px;
	margin: 0px 0px 0px 0px;
	/*font-size:0.875em;*/
	}

.arrowgreen ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	}
	
.arrowgreen li a{
	display: block;
	height: 12px; /*Set to height of bg image- padding within link (ie: 32px - 4px - 4px) default was 24*/
	padding: 1px 0 7px 12px;
	text-decoration: none;
	}	
	
.arrowgreen li a:link, .arrowgreen li a:visited {
	color: #606060;
	}

.arrowgreen li a:hover{
	color: #F8F8F8;
	background:#38f;
	}

	
.arrowgreen li a.selected{
	color: #606060;
	background:#ccc;
	}

/* similar thing for the top cart */

A:link {
	color: #0033FF;
	text-decoration: none;
}

A:visited {
	color: #0033FF;
	text-decoration: none;
}

A:active {
	color: #0033FF;
	text-decoration: none;
}

A:hover {
	color: #0033FF;
	text-decoration: underline;
}

A.dark:link {
	color: #c0c0c0;
	text-decoration: none;
}

A.dark:visited {
	color: #c0c0c0;
	text-decoration: none;
}

A.dark:active {
	color: #c0c0c0;
	text-decoration: none;
}

A.dark:hover {
	color: #ffffff;
	text-decoration: none;
}

HR {
	height: 1px;
	color: #999999;
}

IMG.catimage { border:1px; border-color:#000; border-style:solid; vertical-align:top; }

TD.catname { vertical-align:middle; text-align: center; } TD.catnavigation { vertical-align:middle; text-align: left; }

h1 {
	font-style: normal;
	font-weight: normal;
	font-size: 24pt;
}

h2 {
	font-style: normal;
	font-size: 18pt;
	font-weight: normal;
	/*background-image:url(../images/titlebarbar2.gif);*/
	background-image: url("../images/defbar.gif");
	background-repeat:no-repeat;
    text-decoration: none;
}

h3 {
	font-weight: normal;
	font-style: normal;
	font-size: 14pt;
	text-decoration: none;
	margin-bottom: 7px;
    margin-top: 14px;
}

h4 {
	font-weight: normal;
	font-style: normal;
	font-size: 1.2em;
	text-decoration: underline;
}
h5 {
	font-style: normal;
	font-size: 10pt;
	font-weight: normal;
}
h6 {
	font-weight: normal;
	font-style: normal;
	font-size: 8pt;
}

.price {
	color:#203060;
	font-weight: bold;
	font-size: 14pt;
}

.prodname {
	color:#203060;
	font-weight: bold;
	font-size: 14pt;
}


.safetyicon {
	background-color: #fa2;
    float: left;
    margin: 5px 10px;
    padding: 4px;
	width: 50px;
	border: 1px solid #777;
    border-radius: 6px;
}

.safetyiconred {
	background-color: #f44;
}

	
.cobtbl {
	border: 1px;
	border-style: solid;
	border-color:#808080;
	border-collapse:collapse;
	}

/* AL Removes these because they're messing up the cart */
/* .cobhl {
	border: 1px;
	border-style: solid;
	border-color:#808080;
	border-collapse:collapse;
	background-color:#ebebeb;
	}
	
.cobll {
	border: 1px;
	border-style: solid;
	border-color:#808080;
	border-collapse:collapse;
	} */

a.kjm:link,a.kjm:visited
	{
	color:#FFFFFF;
	}

a.kjm:hover,a.kjm:active
	{
	text-decoration:none;
	background:#1E90FF;
	color:#FFF;
	}

a.kjm2:link,a.kjm2:visited
	{
	font-weight:normal;
	color:#FFFFFF;
	text-decoration:none;
	margin:0px auto;
	}




a.kjm2:hover,a.kjm2:active 
	{
	font-weight:normal;
	text-decoration:underline;
	cursor: pointer;
	margin:0px auto;
	}	
	
 /*start inner footer table style */

.bottombar
	{
	color:#FFFFFF;
	margin:auto;
	width:75%;
	padding:40px 0px 20px 0px;
	border:0px solid white;
	text-align:center;
	float:left;
	}

.bottombar2
	{
	color:#FFFFFF;
	padding:5px 5px 5px 5px;
	border:2px solid #1E90FF;
	margin-top: 0px;
	margin-left: 100px;
	width:190px;
	text-align:center;
	}

.rohs
	{
	color:#FFFFFF;
	padding:0px 0px 0px 18px;
	border:0px solid #1E90FF;
	margin-top: 10px;
	margin-bottom: 0px;
	float:left;
	}

.rohs a:link{
	color:#FFFFFF;
	}
	
.spacer2
	{
	clear:both; 
	height:60px;
	}

.oldsearch {
	margin:30px 0 0 0;
	padding:8px;
	border: solid 2px #1E90FF;
	}
	
.spacer
	{
	clear:both; 
	height:20px;
	}

	
/* Form */
.myform
	{
	margin:0 auto;
	width:290px;
	padding-top:0px;
	padding-bottom:5px;
	padding-left:5px;
	padding-right:5px;
	}

/* stylized  */
#stylized
	{
	border:solid 2px #1E90FF;
	background:#606060 url('images/newsSignupBkg6.png') repeat-x;
	background-color: #848484;
	}
	
#stylized h1 
	{
	text-align:center;
	font-size:14px;
	font-weight:bold;
	margin-top:5px;
	margin-bottom:2px;
	color: white;
	}
	
#stylized p
	{
	text-align:center;
	color:white;
	margin:0px auto;
	border-bottom:solid 0px #b7ddf2;
	padding-top:0px;
	padding-bottom:10px;
	padding-left:0px;
	padding-right:0px;
	}
	
#stylized label
	{
	display:block;
	font-weight:bold;
	text-align:left;
	text-shadow: 1px 1px 1px #000;
	width:35px;
	float:left;
	margin-top:11px;
	margin-left:6px;
	}

#stylized .small
	{
	margin:0px auto;
	color:white;
	display:block;
	font-size:11px;
	font-weight:normal;
	text-align:left;
	float:left;
	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:0px;
	}
	
#stylized input
	{
	/*float:left;
	font-size:12px;*/
	padding:4px 2px;
	border:solid 2px #aacfe4;
	width:220px;
	margin:5px 0 10px 10px;
	}
	
#stylized button
	{
	clear:both;
	margin-left:145px;
	margin-top: 0px;
	padding-top:3px;
	padding-bottom:5px;
	width:136px;
	height:29px;
	background: url('images/newssignup3.png') no-repeat;
	border: 0px;
	text-align:center;
	color: white;
	font-size:14px;
	font-weight:bold;
	text-shadow: 1px 1px 1px #000;
	cursor: pointer;
	}
	
.products {
	padding:0px;
	/*cell-spacing:0px;*/
	border-collapse: separate;
	border:0px;
	clear: both; /*MC*/
}	

.TabbedPanelsTab {
	font-size: 12px;
}

/* ~~ This the css file for the Responsive Design of Virtual Gadgets from Ecommerce Templates.
The first section correponds to the maximum width version of 960 pixels ~~ */

body{
    /*margin: 0 auto;*/
}


/* ~~ Element/tag selectors ~~ */
ul, dl { 
	padding: 0;
	margin: 0;
}

ol { 
	margin: 0;
}


a img { 
	border: none;
}

/* ~~ Main heading styling ~~ */
h1 {
	margin-top: 0;	 
	padding-right: 15px;
	padding-left: 15px; 
	color:#000;
}

.navheads2 {
	background: #36c;
	margin:0; 
	color:#fff; 
	padding:0 0 0 8px; 
	height:20px;
	text-align:left;
	font-weight: bold; 
	text-shadow: 1px 1px 1px #333;
	/*font-size:0.875em;*/
}

/*MC remnants from old search-pn in sidebar */
.sidesearch {
	padding: 12px 0px 12px 0px;
}

.sidesearchbox {
	width:148px;
	padding: 10px 0px 38px 0px;
	background:#d9d9d9;
	border: 1px solid #999;
}


.sidebaricons {
	text-align:center;
}

/* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
.header {
	background:url(../images/nbkg003.png) #0b309d repeat-x;
	height:130px;
	margin:0; /*MC used to have 5px at bottom*/
}


/*MC revamp the left stuff logos to include searchbar*/
.kjleftstuff{
	float:left;
	position:relative;
	padding:0px;
	width:575px;
}

.kjjoe{
	padding:0px;
	width:130px;
	height:126px; /*MC 130 - margin*/
	margin:4px 0px 0px 25px;
	background:url(../images/joemagneato.png) no-repeat;
}
.kjjoe img{
	width:120px;
	height:120px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjlogo2{
	position:absolute;
	top:12px;
	right:0px;
	padding:0px;
	width:420px;
	height:76px;
	margin:0px;
	background:url(../images/logobig.png) no-repeat;
}
.kjlogo2 img{
	width:444px;
	height:80px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjsearch {
	position:absolute;
	top:88px;
	right:0px;
	width:420px;
	height:40px;
	padding:2px 0 0 0;
}

.kjsearchfield {
	width:80%;
	font-family:Verdana,Helvetica,sans-serif;
}
.kjsearchbut {
	font-family: Tahoma,sans-serif;
}

.kjrightstuff{
	float:right;
	width:350px; /*350px;*/
	padding:0px 0px 0px 0px; /*0px 20px 0px 0px;*/
}

.kjviewcart{
    /*font-size: 12px;*/
    font-style: normal;
    font-weight: normal;
	height:26px;
}

.kjallorders{
	background-color: #E0E0E0;
    /*border: 1px solid;
    border-radius: 5px 5px 5px 5px;*/
	/*box-shadow: 3px 3px 3px 0px #333;*/
    color: #000099;
	width:100%; /*316px;*/
	margin: 10px 0px 0px 0px;
	padding:8px 0px 8px 0px;/*10px 12px 10px 12px;*/
    /*font-size: 14px;*/
    font-style: normal;
    text-align: center;
}
	
.kjshippolicydets a {
	float:right;
	text-align: right;
	color: #D0D0D0;
    font-size: 11px;
	width:340px;
}

.kjshippolicydets a:hover {
	text-decoration:none;
	color:#fff;
}

.kjtopmenucontainer {
}

.kjtopmenu a {
	text-align: right;
	color: white; /*#D0D0D0;*/
    /*font-size: 12px;*/
    font-style: normal;
    /*font-weight: bold;*/
}

.kjmobilemenucontainer {
	display:none;
}

.pricingtable{
	margin:4px;
	float:left;
	width:295px;
}

/*More proddetail tweaks...*/
.pricequanadd{
	float:left;
	width:100%;
}

.picspacer{
	float:left;
	width:260px;
}

/*Here we add some of the CSS features from http://matthewjamestaylor.com/blog/perfect-3-column.htm */
body {
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	background:#fff;
	min-width:300px;		/* Minimum width of layout - remove line if not required */
					/* The min-width property does not work in old versions of Internet Explorer */
}

@media screen and (min-width: 1366px) {
body{
	max-width:1366px; /*MC */
	margin-left:auto;
	margin-right:auto;
	background:#334; /*334*/
}
}


/* holy grail 3 column settings */
/* column container */
.colmask {
	position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
	float:left;
	width:100%;				/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
}
/* holy grail 3 column settings */
.holygrail {
	background:#e8e8e8;    	/* Right column background colour */
}
.holygrail .colmid {
	float:left;
	width:200%;
	margin-left:-136px; 	/* Width of right column MC*/
	position:relative;
	right:100%;
	background:#fff;    	/* Centre column background colour */
}
.holygrail .colleft {
	float:left;
	width:100%;
	margin-left:-50%;
	position:relative;
	left:286px;         	/* Left column width + right column width MC*/
	background:#e8e8e8;    	/* Left column background colour */
}
.holygrail .col1wrap {
	float:left;
	width:50%;
	position:relative;
	right:150px;        	/* Width of left column MC*/
	/*padding-bottom:1em;*/ 	/* Centre column bottom padding. Leave it out if it's zero */
	padding:10px 0 10px 0;
}
.holygrail .col1 {
	margin:0px 151px 0px 165px;     	/* Centre column side padding:
							Left padding = left column width + centre column left padding width
							Right padding = right column width + centre column right padding width MC*/
	position:relative;
	left:200%;
	overflow:hidden;
}
.holygrail .col2 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:150px;        	/* Width of left column content (left column width minus left and right padding) MC*/
	position:relative;
	right:0px;         	/* Width of the left-hand side padding on the left column MC*/
}
.holygrail .col3 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:136px;        	/* Width of right column content (right column width minus left and right padding) MC*/
	margin-right:0px;  	/* Width of right column right-hand padding + left column left and right padding MC*/
	position:relative;
	left:50%;
}


/*END CSS features from http://matthewjamestaylor.com/blog/perfect-3-column.htm */

/* BEGIN MC mods to incproddetail content */
.previousnext{
	display:none;
}

.detaildescription{
	max-width:650px; /*MC*/
	float:right;
}
/* END MC mods to incproddetail content */


/* Footer styles */
#footer2012 {
	clear:both;
	float:left;
	width:100%;
	border-top:1px solid #000;
	background-color:#2669d2;
	background-image:url('../images/footbkgnd6.png');
	background-repeat:repeat-x;
}

.KJfooter2012 {
	margin: 20px 0 0 100px;
	color:white;
}

.KJfooter2012 ul {
	list-style-type: none;
	padding: 0;
	margin: 0 0 20px 0;
	width: 250px;
}

.KJfootercol {
	float:left;
}

.KJfooter2012 lh {
	background-color: #1E90FF;
    padding: 0 5px;
}

.KJfooterlistheader {
	background-color: #1E90FF;
    padding: 0 5px;
}

.KJfooter2012 li {
	padding: 5px 0 0 0;
}

#footer2012 p {
	margin:0;
}


/* MC adds softcart CSS */
.sccartitems{
	display:none;
}

.sccarttotal{
	background-color:#36c;
	color:#fff;
	text-shadow: 1px 1px 1px #333;
	padding:3px;
	text-align:right;
	/*background:#f1f1f1;*/
	/*border-top:1px dotted #567CBB;*/
	font-weight:bold;
	/*color:#666*/
}

.scwrap{
	margin:120px auto 0 auto;
	background:#FFF;
	width:500px;
	padding:6px;
	border-radius:6px;
	box-shadow:1px 1px 5px #333;
}

.scimage{
	padding:0px 0px 20px 0px;
}

.scprodsadded{
	padding:3px;
	text-align:left;
	/*width:100%;*/
	border-top:1px solid #36c; /*567CBB*/
	clear:both
}

/*Table backgrounds for cart and search*/
table.cobtbl{
	background-color: #e8e8e8; /*#e8e8e8;*/
	border-radius: 5px;
	/*box-shadow: 1px 1px 3px #666;*/
    margin-top:12px;
} 

td.cobhl{
	/*background-color:#f6f6f6;*/
	/*font-weight: bold;*/
	color:#000;
}

td.cobll{
	background-color: #fff;
	color : #333;
}

/* The product page - view all the available classes at http://www.ecommercetemplates.com/help/css-layouts.asp
-------------------------------------*/
div.prodfilter{
	float:left;
	padding:6px;
	margin-bottom:2px;
	margin-top:2px;
}

div.prodfilterbar{
	float:left;
	background-color:#e8e8e8;
	margin:0 10px 10px 10px;
	border: 1px solid #AAAAAA;
    border-radius: 6px 6px 6px 6px;
}

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

div.product{
	padding:10px;
	width:204px;
	float:left;
	height:350px;
	margin:4px 0px 0px 4px;
	border:1px solid #aaa;
	background-color:#E8E8E8;
	border-radius: 2px;
}

div.prodnavigation{
	padding:10px;
	margin-bottom:10px;
	/*float:left;*/
	width:100%; /*MC*/
	/*background-color:#aaf;*/
}

/*MC adds rangesliders to discs/cylinders...*/
.rangesliders {
	background-color:#e8e8e8;
	border:1px solid #aaa;
	border-radius:6px;
	width:80%;
	padding:5px 20px 10px 20px;
	margin-left:4px;
}
.thesliders {
	/*background-color:#faa;*/
	margin:0px 135px 10px 0px;
}
.slidericon {
	float:right;
	/*background-color:#aaf;*/
}

.rangesliderlabel {
	border:0;
	color:#203060;
	font-weight:bold;
	font-size: 14pt;
	background-color:#e8e8e8;
}

.mcshowhideOLD {
	/*border-top: 1px solid #96d1f8;*/
	/*background: #070;
	background: -webkit-gradient(linear, left top, left bottom, from(#7d5), to(#070));
	background: -webkit-linear-gradient(top, #7d5, #070);
	background: -moz-linear-gradient(top, #7d5, #070);
	background: -ms-linear-gradient(top, #7d5, #070);
	background: -o-linear-gradient(top, #7d5, #070); */
	background-color: #070;
	background-image: linear-gradient(#7d5, #070);
	padding: 2px 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	/*-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;*/
	/*box-shadow: rgba(0,0,0,1) 0 1px 0;*/
	text-shadow: rgba(0,0,0,.4) 0 1px 0;
	color: white;
	font-size: 1em;
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight:bold;
	text-decoration: none;
	vertical-align: middle;
	}
.mcshowhideOLD:hover {
	/*background: #181;
	background: -webkit-gradient(linear, left top, left bottom, from(#6b4), to(#181));
	background: -webkit-linear-gradient(top, #6b4, #181);
	background: -moz-linear-gradient(top, #6b4, #181);
	background: -ms-linear-gradient(top, #6b4, #181);
	background: -o-linear-gradient(top, #6b4, #181);*/
	background-color: #181;
	background-image: linear-gradient(#6b4, #181);
	}
/*.mcshowhide:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }*/


   
.mcshowhide {
  background: #88ee88;
  background-image: -webkit-linear-gradient(top, #88ee88, #22bb22);
  background-image: -moz-linear-gradient(top, #88ee88, #22bb22);
  background-image: -ms-linear-gradient(top, #88ee88, #22bb22);
  background-image: -o-linear-gradient(top, #88ee88, #22bb22);
  background-image: linear-gradient(to bottom, #88ee88, #22bb22);
  -webkit-border-radius: 2;
  -moz-border-radius: 2;
  border-radius: 2px;
  font-family: Arial, Helvetica, Sans-Serif;
  color: black;
  /*font-size: 16px;*/
  font-weight: bold;
  text-shadow: rgba(255,255,255,.4) 0 1px 0;
  padding: 3px 8px;
  border: solid #707070 1px;
  text-decoration: none;
}

.mcshowhide:hover {
  background: #22bb22;
  text-decoration: none;
}
   
   
   
   
   
div.prodimage{
	/*padding: 0px 10px 5px 0px;*/
	margin-bottom:6px;
	text-align:left;
}

.prodimagetop {
	padding: 0px 10px 5px 0px;
}
/*
img.prodimage{
	-webkit-box-shadow: 1px 1px 2px 0px #888;
	box-shadow: 1px 1px 2px 0px #888; 
}*/

div.prodname{
	padding:0px;
	font-size: 13pt;
}

div.proddescription{
	font-size: 1em;
	padding-top:4px;
	padding-bottom:6px;
	height:120px;
}

div.prodoptions{
	float:right;
	height:28px;
}

select.prodoption{
	font-size: 0.9em;
	float:right;
	margin:6px 0 0 6px;
	background:#CCC;
}

span.prodoption{
	font-weight:bold;
}

div.optiontext{
	float:left;
	padding-top:8px;
}

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


div.prodprice{
	padding: 4px 0px 0px 0px;
	font-weight:bold;
	clear:both;
}


div.addtocart{
	padding-top:6px;
}

div.outofstock{
	/*text-align:center;*/
	padding-top:6px;
	font-weight:bold;
}

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

.quantitydiv {
	padding: 0px 0px 5px 0px;
}

.pricequanaddprod {
	text-align:right;
}

.prodicons {
	float:right;
	clear:both;
	background:#ccc;
	padding: 1px 3px 1px 3px;
	margin-bottom: 4px;
	border: 1px solid #aaa;
	border-radius: 2px;
	-webkit-box-shadow: 1px 1px 2px 0px #888;
	box-shadow: 1px 1px 2px 0px #888; 
}

.magdiricon {
	float:right;
	clear:both;
	/*background:#ccc;*/
	padding: 1px 3px 1px 3px;
	margin-bottom: 4px;
	/*border: 1px solid #aaa;
	border-radius: 2px;
	-webkit-box-shadow: 1px 1px 2px 0px #888;
	box-shadow: 1px 1px 2px 0px #888; */
	/*width:60px;*/
}

/* The product detail page 
-------------------------------------*/
.detailimage {
	float:left;
	width:230px; /*MC*/
	padding:0 10px 10px 10px;
} 

.detailname {
	color:#000;
	padding:0 10px;
	color: #203060;
    font-size: 14pt;
    font-weight: bold;
	margin:0 0 10px 0;
}

.detaildiscounts{
	color:#c00;
	font-weight:bold;
	font-size: 1em;
	float:left;
	width:310px;
	margin:10px 0 0 10px;
}

span.detaildiscountsapply{
	color:#c00;
	font-weight:bold;
}


div.detaildescription{
	float:left;
	padding-left:6px;
}


div.detailprice{
	width:100%;
	padding-top:8px;
}



.detailprodoption{
	width:220px;
	float:right;
	background:#ccc;
}

div.detailoptiontext{
	float:left;
	text-align:left;
	font-weight:bold;
}

div.detailoptions{
	width:100%; /*460 MC*/
	text-align:left; /*MC adds*/
	float:left;
	padding-top: 6px;
}


div.detailquantity{
	float:left;
	width:100%;/*640px MC*/
	text-align:center;
	padding-top: 6px;
}

div.detailquantitytext{
	margin:6px 0 0 0;
	float:left;
	text-align:right;
	font-weight:bold;
}

div.detailquantityinput, div.detailquantity0div {
	margin:4px;
	float:left; /*right MC*/
	text-align:left;
}

div.detailaddtocart{
	float:left;
	width:100%;
	padding-bottom:10px;
}


/* The category page 
-------------------------------------*/
div.category{
	width:48%;
	float:left;
	min-height:110px;
}

div.catimage{
	width:130px;
	float:left;
	margin:0 5px 5px 0;
}

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

div.catname{
	padding-left:12px;
}



hr {
	height: 0;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #60a1de;
}


a[href^=tel]{
    color:inherit;
    text-decoration:none;
	/*Leaves styling intact on phones*/
}


.KJvideo {
	width:500px;
	height:300px;
}

/*styling for default*/
.def p {
	margin: 2px 0px 18px 10px;
}

.def h2 {
	background-image: url("../images/defbar.gif");
    background-repeat: no-repeat;
    font-size: 16px;
	margin-bottom: 4px;
}


#MCminicart, #MCminicart ul, #MCminicart ul li, #MCminicart ul ul {
  list-style: none; 
  margin: 0; 
  padding: 0;
  border: 0;
}

/* Basic Structure */

#MCminicart ul {
  position: relative;
  z-index: 397; 
}
#MCminicart ul li {
  min-height: 1px;
  line-height: 1em;
  vertical-align: middle;
}
#MCminicart ul li:hover {
  position: relative; 
  z-index: 399;
  cursor: default;
}
#MCminicart ul ul {
  visibility: hidden; /* hide sub menus by default */
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 398; 
  width: 100%;
}

#MCminicart ul li:hover > ul {
  visibility: visible; /* show sub menu */
}
#MCminicart ul ul {
  top: 100%; /*MC*/
  left: 0; /*MC*/
}

/* Custom Styles */

#MCminicart ul {
	width: 340px; /* main menu width */
	background: #efefef;
	-moz-box-shadow: 3px 3px 3px 0px #333;
	-webkit-box-shadow: 3px 3px 3px 0px #333;
	box-shadow: 3px 3px 3px 0px #333;
}
#MCminicart ul ul {
	left:30px; /*MC indent the dropdown*/
	width: 260px; /* sub menu width 340 */
}
#MCminicart ul li {
	padding: 4px 10px 4px 10px; /*MC was 4 10*/
	color: #000;
}
#MCminicart ul li:hover {
  background: #38f;
  color: #fff;
}
  
#MCminicart ul a {
	display:block; /*MC makes the whole line act like a link*/
}

#MCminicart ul ul a {
	display:block; /*MC makes the whole line act like a link*/
}

  
#MCminicart ul a:link,
#MCminicart ul a:visited {
  color: #000;
  text-decoration: none;
  /*padding: 4px 0px 0px 0px; MC*/
}
#MCminicart ul a:hover {
  color: #fff;
}
#MCminicart ul a:active {
  color: #ffa500;
}

.MCviewcart {
	color:#fff;
	align:right;
	/*text-align:right;*/
	display:block;
	background:#36c;
	float:right;
	padding: 3px 20px 4px 20px; /*MC3px 20px 3px 20px;*/
	margin: -4px -10px 0px 0px;
	border: 1px solid #333;
	font-weight: bold;
	text-shadow: 1px 1px 1px #333333;
}

.MCcartpic {
	padding: 0px 10px 0px 0px;
}

.MCcartprodname {
	/*background:#faa;*/
	clear:both;
	float:left;
	width:65%;
}

.MCcartprodqty {
	/*background:#ffa;*/
	color:#666;
}

.cartbut {
	display:block;
	background:#36c;
	text-align:center;
	color:#fff;
	font-weight:bold;
}

.cartbuttxt {
	color:#fff;
	text-shadow: 1px 1px 1px #333333;
}

.arts a{
	display:block;
	background:url(../images/SmBlogNoBtn.jpg);
	width:220px; /*MC 240 minus padding left and right */
	height:115px; /*MC 135 minus padding top and bottom */
	margin-bottom:10px;
	padding:10px;
	font-size:14px;
	color:#fff;
	text-shadow: 1px 1px 1px #333333;
}

.arts a:hover{
	text-decoration:none;
}

.newssign a{
	display:block;
	background:url(../images/newsletter2.jpg);
	width:220px;
	height:60px;
	padding:10px;
	font-size:14px;
	color:#fff;
	text-shadow: 1px 1px 1px #333333;
}

.newssign a:hover{
	text-decoration:none;
	/*color:#38f;*/
}



.fpwrapper{
   width: 100%;
   margin: 0 0 20px 0;
   height:225px;
}

.fpwrapleft{
   float: left;
   width: 100%;
}
.fpleft{
   margin-right: 250px;
   height: 200px;
}
.fpright{
   float: right;
   width: 240px;
   margin-left: -240px;
   height: 200px;
}


.KJcartbar {
	background:#ccc;
	padding: 0px;
	border: 1px solid #aaa;
	border-radius: 2px;
	-webkit-box-shadow: 1px 1px 2px 0px #888;
	box-shadow: 1px 1px 2px 0px #888;
}

.KJcartbaritem {
	background:#ccc;
	padding: 4px;
	border: 1px solid #aaa;
	border-radius: 2px;
}

.KJcartbaron {
	background:#3366cc;
	padding: 4px;
	border: 1px solid #aaa;
	border-radius: 2px;
	-webkit-box-shadow: 1px 1px 2px 0px #888;
	box-shadow: 1px 1px 2px 0px #888;
	color:#fff;
	font-weight:bold;
	text-shadow: 1px 1px 1px #333333;
}

.KJcartbarnotyet {
	background:#eee;
}

.cartimage {
	width:125px; /*MC shrinks 6.4.8 */
}


@media screen and (max-width: 980px) {
.fpright{
	display:none; /*MC*/
}

.fpleft{
   margin-right: 0px;
}
}

/*width on products.asp page*/
@media screen and (max-width: 1032px) {
div.product{
	width:196px;
}
}

@media screen and (max-width: 1000px) {
div.product{
	width:220px;
}
}

/*MC adds breakpoint hack*/
@media screen and (max-width: 1250px) {
.detaildescription{
	max-width:520px; /*MC*/
}
}

/*MC adds breakpoint hack*/
@media screen and (max-width: 1152px) {
.detaildescription{
	max-width:394px; /*MC*/
}

.KJvideo {
	width:375px;
	height:225px;
}

}

/*MC adds breakpoint hack*/
@media screen and (max-width: 1024px) {
.detaildescription{
	max-width:350px; /*MC*/
}

.KJvideo {
	width:330px;
	height:198px;
}

}

/*MC make a std way to shrink big pix for small widths */
.KJbigimg {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}
@media screen and (max-width: 400px) {
.KJbigimg {
    max-width: 99%;
}
}

.blogimage {
	padding: 2px;
	margin: 5px 10px 5px 10px;
	float:right; /*MC let's do this by default */
}

/*Experiment with new image setup here */

.KJpicc {
	background-color:#e8e8e8;
	float:right;
	padding: 2px;
	margin: 5px 10px 5px 10px;
	}

.KJpic {
	/*background-color:#aaf;*/
	margin-bottom:1px;
	}

.KJcaption {
	/*background-color:#faa;*/
	max-width:300px;
	text-align:center;
	margin: 0 auto; /*center*/
	}

ol li {
	/*list-style:decimal;
	padding-left:0.5em;*/
}

/*quick links bar on front page*/
.quickcats {
	background:#faf;
	padding:0px;
	
}

.quickcat a{
	display:block;
    background-color: #E8E8E8;
    float: left;
    height: 80px;
    margin: 0px 4px 4px 0px;
    padding:6px 8px 8px 8px;
    width: 18%;/*150px;*/
	font-size:16px;
	font-weight:normal;
	color:#fff;
}

.quickcat a:hover{
	text-decoration:none;
}

.qcmore a{
	width: 12%;
}


@media screen and (max-width: 1024px) {
.quickcat a{
	width: 16%;
}
.qcmore a{
	width: 12%;
}
}

@media screen and (max-width: 770px) {
.quickcat a{
	padding:4px;
	/*font-size:14px;*/
}
}

@media screen and (max-width: 480px) {
.quickcat a{
	padding:4px;
	width: 45%;
	height: 60px;
}
.qcmore a{
	width: 93%;
}
.fpwrapper{
   display:none;
}
}

.welcomefriends {
	float: left;
}

.calctable {
	border-collapse:collapse;
	box-shadow: 1px 1px 3px #666666;
}

.optiontext {
	display:none;
	}


.makeblue {
	background-color:#3366cc;
	}

.makewhite {
	color:#fff;
	text-shadow: 1px 1px 1px #333333;
	}

.shipbill {
	color: #FFF;
	font-size: 16px;
	text-shadow: 1px 1px 1px #333333;
	}

/*Recently Viewed MC*/	
.rviewed {
	clear:both;
	padding-top:20px;
	}
	
.recviewhdr {
	background:#36c;
	color:#fff; 
	padding:2px 0 4px 8px;
	/*height:20px;*/
	text-align:left;
	font-weight: bold; 
	text-shadow: 1px 1px 1px #333;
}

.recviewitem {
	background-color: #E8E8E8;
    border: 1px solid #AAAAAA;
    border-radius: 4px 4px 4px 4px;
    float: left;
    height: 150px;
    margin: 4px 0 0 4px;
    padding: 10px;
    width: 200px;
	text-align:center;
	}

.rviewname {
	font-size:12pt;
	}

/*Recently Viewed MC, smaller width*/	
@media screen and (max-width: 700px) {

.recviewitem {
    height: 120px;
    margin: 4px 0 0 4px;
    padding: 10px 4px;
    width: 130px;
	}

.rviewname {
	font-size:9pt;
	}

.recviewdescrip {
	display:none;
	}

}

/* 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: 980px) {


.kjlogo{
	width:375px;
	height:129px;
	background:url(images/topbanner375.png);
}

.kjlogo img{
	width:375px;
	height:125px;
	/*size of the clearpixel, which is a clickable area*/
}


/*MC revamp the left stuff logos to include searchbar*/
.kjleftstuff{
	width:375px;
}

.kjjoe{
	/*float:left;*/
	padding:0px;
	width:110px;
	height:126px; /*MC 130 - margin*/
	margin:4px 0px 0px 15px;
	background:url(../images/joemagneato.png) no-repeat;
}
.kjjoe img{
	width:120px;
	height:120px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjlogo2{
	/*float:left;*/
	position:absolute;
	top:8px; /*12*/
	right:0px;
	padding:0px;
	width:240px; /*420*/
	height:80px; /*76 */
	margin:0px;
	background:url(../images/logomed.png) no-repeat;
}
.kjlogo2 img{
	width:240px;
	height:80px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjsearch {
	position:absolute;
	top:88px;
	right:0px;
	width:220px; /*420*/
	height:40px;
	/*background:#faf;*/
	padding:2px 0 0 0;
}

.kjsearchfield {
	width:150px;
}


h1 {
	padding-left: 38px; 
}

.detailprodoption{
	width:220px;
float:right;
}

div.detailquantitytext{
	/*width:260px;*/
}

div.detailquantityinput{
	width:100px;
}

div.detailaddtocart{
	width:600px; /* was 500 MC */
}


div.category{
	width:520px;
}

.picspacer{
	width:200px;
	/*display:none;*/
}

.spacer2 {
	height:40px;
}

}

.footartlist {
	display:none;
}

/* 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:770px) {

.footartlist {
	display:block;
}

.header {
	background:url(../images/nbkg003c.png) #0b309d repeat-x;
	height:110px; /*was 120 before search*/
}

.kjrightstuff{
	display:none;
}

.kjlogo{
	width:310px;
	height:82px; /*was 82 before search*/
	background:url(images/topbanner310.png);
}

.kjlogo img{
	width:310px;
	height:82px; /* was 82 */
	/*size of the clearpixel, which is a clickable area*/
}

.cartimage {
	width:60px; /*MC shrinks for larger mobile */
}


/*MC revamp the left stuff logos to include searchbar*/
.kjleftstuff{
	float:left;
	position:relative;
	padding:0px;
	width:310px;
}

.kjjoe{
	padding:0px;
	width:70px;
	height:78px; /*MC 130 - margin*/
	margin:2px 0px 0px 10px;
	background:url(../images/joemagneatojr2.png) no-repeat;
}
.kjjoe img{
	width:80px;
	height:84px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjlogo2{
	/*float:left;*/
	position:absolute;
	top:6px;
	right:0px;
	padding:0px;
	width:230px;
	height:40px;
	margin:0px;
	background:url(../images/logosml.png) no-repeat /*#aaa*/;
}
.kjlogo2 img{
	width:175px;
	height:40px;
	/*size of the clearpixel, which is a clickable area*/
}

.kjsearch {
	position:absolute;
	top:42px;
	right:0px;
	width:230px;
	height:38px;
	padding:2px 0 0 0;
}


/* Turn off the side columns */
.col2{
	display:none;
}

.col3{
	display:none;
}


.holygrail {
	background:#f0f0f0;    	/* Right column background colour */
}
.holygrail .colmid {
	float:left;
	width:200%;
	margin-left:0px; 		/* Width of right column MC -136*/
	position:relative;
	right:100%;
	background:#fff;    	/* Centre column background colour */
}
.holygrail .colleft {
	float:left;
	width:100%;
	margin-left:-50%;
	position:relative;
	left:0px;         		/* Left column width + right column width MC 286*/
	background:#f0f0f0;    	/* Left column background colour */
}
.holygrail .col1wrap {
	float:left;
	width:50%;
	position:relative;
	right:0px;        	/* Width of left column MC 150*/
	padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
}
.holygrail .col1 {
	margin:0px 10px;     	/* Centre column side padding: MC was 0px 10px before cart300
							Left padding = left column width + centre column left padding width
							Right padding = right column width + centre column right padding width MC 0 165px*/
	position:relative;
	left:200%;
	overflow:hidden;
}
.holygrail .col2 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:0px;        	/* Width of left column content (left column width minus left and right padding) MC 150*/
	position:relative;
	right:0px;         	/* Width of the left-hand side padding on the left column MC*/
}
.holygrail .col3 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:0px;        	/* Width of right column content (right column width minus left and right padding) MC 116*/
	margin-right:0px;  	/* Width of right column right-hand padding + left column left and right padding MC 10*/
	position:relative;
	left:50%;
}


/* Turn off the side columns END*/

.kjmobilemenucontainer {
	display:block;
	/*float:right;*/
	margin: 0px 0px 0px 10px;
}

.kjmobilemenu a {
	text-align: left;
	/*color: #606060;*/
	color: #000;
	font-family: Tahoma,sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
	background: #e8e8e8;
    margin: 0px 0px 0px 0px;
    padding:2px 8px 2px 8px;
}


body{
	/*background:url(images/topbg480.jpg) #fff repeat-x;*/
}

.header {
	/*background:url(images/topbg480.jpg) #fff repeat-x;
	height:140px;*/
}

p{
	/*padding-left:12px;*/
}


h1 {
	/*display:none;*/
}

/*tables for cart and search*/
table.cobtbl{
	font-size: 0.8em;
    margin-left:2px;
    margin-bottom:12px;
}

td{
	font-size: 10px;
}

/*remove footer elements*/


/*the product page*/

div.product{
	width:204px;
	/*height:auto;*/
	/*margin-left:14px;*/
}

div.prodnavigation{
	/*width:340px;*/
	padding-left:14px;
}

div.prodoptions{
	/*width:325px;*/
}

select.prodoption{
	/*width:130px;*/
}

div.optiontext{
	/*min-width: 175px;*/
}


div.prodprice{
	/*width:340px;*/
}


div.addtocart{
	/*width:340px;*/
}

div.pagenums{
	width:340px;
}

/*the detail page*/
div.detailimage{
	width:460px;
	margin-left:6px;
}

.detailname {
	/*width:380px;*/
	/*background:#59c;*/
}

div.detailprice{
	width:420px;
}

.detailprodoption{
	width:220px;
	float:right;
}

div.detailoptiontext{
    /*min-width:240px;*/
	float:left;
	/*width:180px;*/ /* MC */
}

div.detailoptions{
	width:420px;
	/*padding-left:10px;*/
	float:left;
}

div.detaildescription{
	width:375px; /*MC was 420*/
}

div.detailquantity{
	width:400px;
}

div.detailquantitytext{
	/*width:180px;*/
}

div.detailquantityinput{
	width:200px;
}

div.detailaddtocart{
	width:420px;
}

div.category{
	width:420px;
}

.picspacer{
	width:50px;
	/*display:none;*/
}

.KJfooter2012 {
	margin-left: 40px;
}

}

/* 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) {

body{
	/*background:url(/images/topbg480.jpg) #fff repeat-x;*/
}

.header {
	/*background:url(images/topbg480.jpg) #fff repeat-x;
	height:140px;*/
}

h1 {
	/*display:none;*/
}

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

div.prodnavigation{
	/*width:190px;*/
}

div.product{
	width:260px;
	/*height:auto;
	margin-left:4px;*/
}

div.prodnavigation{
	/*width:290px;*/
	padding-left:14px;
}

div.prodoptions{
	/*width:292px;*/
}

select.prodoption{
	/*width:130px;*/
}

div.optiontext{
	/*min-width: 142px;*/
	/*width: 80px;*/
}


div.prodprice{
	/*width:292px;*/
}


div.addtocart{
	/*width:292px;*/
}


div.pagenums{
	width:292px;
	padding:2px;
}

/*the detail page*/
div.detailimage{
	width:292px;
	/*padding:6px;*/
	float:left;
}

.detailname {
	width:292px;
}

div.detailprice{
	width:292px;
}

div.detailoptions{
	width:280px;
	/*padding-left:6px;*/
}

.detailoptiontext{
	/*width:140px;*/
}

select.detailprodoption{
	width:118px;
}

div.detailquantity{
	width:192px;
}

div.detailquantitytext{
	/*width:120px;*/
}

div.detailquantityinput{
	width:40px;
}
div.detaildescription{
	width:292px;
}

.KJvideo {
	width:272px;
	height:163px;
}

div.detailaddtocart{
	width:292px;
}

/*the category page*/
div.category{
	width:292px;
}

.pricingtable {
	width:250px;
}

.KJabbrev {
	display:none;
}

}

/*iPhone 3*/
@media screen and (max-width:380px) {

.kjlogo{
	width:310px;
	height:82px;
	background:url(images/topbanner310.png);
}

.kjlogo img{
	width:310px;
	height:82px;
	/*size of the clearpixel, which is a clickable area*/
}

.KJfooter2012 {
	margin-left: 15px;
}

}

/*iPhone 3 portrait*/
@media screen and (max-width:350px) {

div.detaildescription{
	width:275px;
}

.KJvideo {
	width:255px;
	height:153px;
}

.KJfooter2012 {
	margin-left: 5px;
}

}


.ref {
    position: relative;
    vertical-align: baseline;
   }

.refnum {
    position: relative;
    left: 2px;
    bottom: 1ex;
    color: #0033ff;
    font-size: 75%;
    /*font-weight: bold;*/
    text-decoration: underline;
    cursor: pointer;
}

.refbody {
    font-size: 80%;
    line-height: 1.1;
    display: block;
    min-width: 225px;
    position: absolute;
    right: 25px;
    bottom: 5px ;
    border: 1px solid;
    padding: 5px;
    background-color: #cedff8;
    word-wrap: break-word;
    z-index: 9999;
    overflow: auto;
}

.kjcib {
	/* KJ cart indicator box */
	background:#e8e8e8;
	padding:4px;
	margin:0px 0px 10px 0px;
}
.kjcibsel {
	/* KJ cart indicator box selected */
	font-weight:bold;
	padding:4px 8px;
	background:#f0f097;
}
.mcqtyhider{font-weight:bold;}

/*MC does some debug coloring in*/
/*
.accloginwrapper {
	background:#faa;
}
#loginacctdiv {
	background:#afa;
}

#liaccterrordiv {
	background:#aaf;
	margin:10px;
	padding:10px;
}
*/





/*MC sticks mobile hamburger menu styling here for now*/


a
{
  text-decoration: none;
  color: #232323;
  
  /*transition: color 0.3s ease;*/
}
/*
a:hover
{
  color: tomato;
}
*/

#menuToggle
{
  display: block;
  position: relative;
  top: 0px;
  left: 10px;
  
  z-index: 10;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 20; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 10;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #232323;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#kjmmenu
{
  position: absolute;
  width: 150px;
  margin: -40px 0 0 -50px;
  padding: 50px;
  padding-top: 50px;
  
  background: #ededed;
  
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

.kjmobli {
	color:#000;
	/*border-style:solid;
	border-color:#505050;
	border-width:1px;
	border-top-style: solid;
    border-right-style: none;
    border-bottom-style: solid;
    border-left-style: none;*/
}

/*
.kjmoblili, .kjmoblilo {
	color:#00a;
}*/

#kjmmenu li
{
  padding: 8px 0px 12px 0px;
  margin:1px;
  /*background:#aaf;*/
  font-size: 14px;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}

.kjmobilemenu2 {
	max-width:50px;
	float:left;
}

div.accloginwrapper, div.acccreatewrapper {
	margin:120px auto 0 auto;
	background:#FFF;
	width:600px;
	padding:6px;
	border-radius:5px;
	box-shadow:1px 1px 5px #333;
}


@media screen and (max-width:770px) {
div.accloginwrapper, div.acccreatewrapper {
	width:440px;
}
}

@media screen and (max-width:480px) {
div.accloginwrapper, div.acccreatewrapper {
	width:300px;
}
}


div.kjpd{
	display:none;
}

@media screen and (max-width:1000px) {
	div.popup{
		width:90%;
	}
}

/*Shrink shipping font size in small mobile browsers*/
/* No longer needed because we don't use tables on this page anymore? */
/* @media screen and (max-width:360px) {
td{
	font-size: 9px;
}
} */

/*AL custom stuff to overwrite cart css*/

/* initial cart page */
#oc{
	display:none;
}

div.cartdetailsid{
	display:none;
}

div.cartcoupon_cntnr{
	display:none;
}
.cartdetails_cntnr{
	background-color: #ebebeb; /*al kills 7.1.11 MC puts back...*/
	border-bottom: 1px solid #999;
    font-weight: bold;
}
div.cartdetails{
	border:none;
}
.cartheader, .cdformshipdiff{
	padding-top: 4px;
	text-align: center;
	font-weight: bold;
}

/* .cartlineid{
	background-color: #ebebeb;
} */
div.cartcheckoutbuttons, div.checkoutopts, .checkoutbutton{
	text-align: center;
	float: none;
}

div.cartoptiongroup{
	visibility: hidden;
}



@media all and (min-width: 940px){
	div.cartandoptsline, div.cartline{
		margin: 0px;
		padding: 0px;
	}
	.cartdetails_cntnr{
		text-align:center;
	}

	.cartline{
		text-align:center;
	}
	.cartoptionsline{
		text-align:center;
		font-weight:bold;
	}
	
	.cartlineid{
		padding-top: 3px;
		padding-bottom: 3px;
	}
	div.cartdetailsname{
		width:60%;
    }
    
    div.cartlinenamecr{
		width:35%;
    }
    
    
}

/* address page */
div.cart2details{
	/* border-left: 1px solid #ccc; */
	/* box-shadow: 1px 1px 3px #666; */
	/* width:99%; */
	margin-bottom:5px;
}
/* .cart2details, .cobhl2{ 'al kills in 7.1.11
	background-color: #ebebeb;
} */
div.cart2details div.cobhl2{
	text-align: right;
	/* border-top: 1px solid #ccc; 7.1.11 not great*/
}
/* 
div.cobll2, div.checkoutbutton2{ 7.1.11 this doesn't look great
	background-color: #fbfbfb;
	border-top: 1px solid #ccc;
} */

div.checkoutadditionals div{
	padding-right: 0px;
}

div.checkoutadditionals .cobll2{
	/*width: 70%;*/
}

div.checkoutbutton2{
	margin: 0px;
	text-align: center;
}
div.cart2header, div.cart2column{
	margin: 0px;
}

/* .checkoutadditionals > div{ 7.1.11 this doesn't look good
	border-top: 1px solid #ccc;
} */



.billformrow div.cobll2, .shipformrow div.cobll2, div.cdformcountry{
	padding-bottom:8px;
	/*border-top: 1px solid #ccc;*/

}



.checkoutadditionals div.cobll2{
	padding-left:12px;
}
@media all and (max-width: 940px){
	.checkoutadditionals div.cobll2{
        padding-left:2px;
    }

}

.checkoutadditionals div.cobhl2{
	/*margin-left:-6px;
	padding-right:3px;*/
}

div.checkoutbutton2{
	/* border-top: 1px solid #ccc; */
	padding-top: 15px;
	padding-bottom: 15px;
}


@media all and (max-width: 940px){
	div.checkoutadditionals .cobhl2{
		/*width: 10% !important;*/
	}

}

@media all and (max-width: 480px){
	div.cobhl2, div.cobll2, div.cart2header, div.cart2column, div.cdformshipdiff{
		width: 99%;
	}
	div.cdformpayment,div.checkoutbutton2, div.cdformtpayment, div.cdformcoupon, div.cdformtcoupon, div.cart2header, div.cdformshipdiff, div.cart2subheader{
		width:100%;
	}
	div.cart2details div.cobhl2, div.cart2details div.cobll2{
        text-align: center;
        padding-top:6px;
	}
	.billformrow .cobhl2, .shipformrow .cobhl2, div.cdformtcountry{
		/*border-top: 1px solid black !important;*/
		background-color: #f5f5f5;
	}
	.billformrow .cobll2, .shipformrow .cobll2, div.cdformcountry{
		background-color: #f5f5f5;
	}
	div.cart3totgoodst,div.cart3totgoods, div.cart3gndtott, div.cart3gndtot, div.kjstatetax, div.kjstatetaxt, div.ectdscntt, div.ectdscnt, div.cart3sustott, div.cart3sustot{
		width:47.5%;
    }
    
    div.checkoutadditionals {
        border-top: 1px solid #ccc;
        background-color: #f5f5f5;
    }

    div.checkoutbutton2{
        /* border-top: 1px solid #ccc; */
    }

}

/*address page with login*/

.cdformtitle{
	font-weight:bold;
	/* padding-left: 5px; */
}

#addressspan1, #saddressspan1{
	padding-left:5px;
}

/* Shipping selection page */
/* mobile first, stock css looks fine without any modifications */
div.checkoutbutton3{
	text-align:center;
}

/* div.cobhl4, div.cobhl3{
	background-color:#ebebeb;
}*/
/* div.ALCartItems{
	width: 15%;
}

div.kjFinalPageCartStuff{
	width: 85%;
} */

div.cobll3 , div.cobhl3 {
	border: none;
}

.kjFinalPageCartStuff > div{
	float: left;
	width: 100%;
	/* background-color: #fbfbfb; */
	/* text-align:center; */
	/*border-bottom: 1px solid #ddd;*/
	padding: 0px 0px 2px 0px;
}

/* mike's added address stuff */
.kjcartaddy{
	width: 100%;
	overflow:auto;
}
.kjcart_addr{
	width: 50%;
	float: left;
}


/* .kjFinalPageCartStuff > div:nth-child(odd){
	background-color: #ebebeb;
} */

.kjFinalPageCartStuff > div > div{
	float: left;
	width: 25%;
	text-align:right;
}

.kjFinalPageCartStuff > div > div:last-child{
	/* background-color: yellow; */
	/* width: 12.5%; */
	/* text-align:right; */
}


.kjFinalPageCartStuff > div > div:first-child{
	/* display:block; */
	/* width:12.5%; */
	text-align:left;

}



div.shiptableline{
	overflow: initial;
}


div.cart3totgoods, .cart3gndtott, div.cart3gndtot, div.cart3totgoodst, .kjstatetax, .cart3row .ectdscnt, .cart3sustot{
	font-size: 1em;
}
.kjcomparerates{
	border-bottom: 1px solid #ccc;
}


.cart3header{
	margin-top:0px;
}
.cart3row{
	border-bottom: 1px solid #ccc;
}

div.cart3totgoods, div.cart3gndtott, div.kjstatetax, .cart3row div.ectdscnt, div.cart3sustot{
	text-align:right;
	/* width:61.25%; */
}

@media all and (min-width: 480px){
	div.cart3totgoods, div.cart3gndtott, div.kjstatetax, .cart3row div.ectdscnt, div.cart3sustot{
		/* text-align:right; */
		width:61.25%;
	}

	/* padding for address fields on login page*/
	.billformrow div.cobhl2, .shipformrow div.cobhl2, div.cdformtcountry, div.cdformtcoupon, div.cdformtpayment{
		padding-right:1%;
		width: 29%;
	}
	.billformrow div.cobll2, .shipformrow div.cobll2, div.cdformcountry, div.cdformcoupon, div.cdformpayment{
		padding-left:1%;
		width: 69%;
	}
	.kjFinalPageCartStuff > div > div:nth-child(3){
		width:14%;
	}
	.kjFinalPageCartStuff > div > div:nth-child(2){
		text-align:left;
	}
	div.ALCartItems{
		width: 20%;
	}
	div.kjFinalPageCartStuff{
		width:80%;
	}
}
/*
.ectwarning{
	background-color: #f8e9be;
}*/


@media all and (max-width: 480px){
	.kjcart_addr{
		width: 100%;
		padding-bottom: 10px;
	}

} 

.buttonLikeLink{
	background: none !important;
	color: inherit;
	border: none;
	padding: 0 !important;
	font: inherit;
	font-family: inherit;
	text-decoration: none;
	color: #0033FF;
	font-family: clean, sans-serif;
	text-shadow: none;
	box-shadow: none;
}
.buttonLikeLink:hover{
	cursor:pointer;
	text-decoration: underline;
}

#estimateShipping{
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

div.popup{
	overflow: hidden;
	background-color:#caf279;
	position: absolute;
	bottom: 25px;
	/*z-index: 10;*/
}
.popup div{
	float:left;
	margin-right: 35px;
	/*margin-left: 15px;*/
}
@media screen and (max-width:1000px) {
	.popup{
		/*width:275px;*/
		/*width:90%; MC was here, moving up*/
	}
	.popup div{
		/*margin-left: 5px;*/
	}
}

#kjxout{
	cursor: pointer;
	color: rgb(199, 14, 14);
	font-weight: bold;
	font-size: 1.2em;
	float: none;
	margin: 0px;
	width: auto;
	/*width: 100%;*/
	text-align: right;
	position: absolute;
	top: 0px;
	right: 0px;
}
.popup ul{
	/*padding-left: 24%;*/
	/*border: 1px solid blue;*/
	list-style: none;
}
.popup li{
}

.alkjcprow:nth-child(even) {
	background-color: #e8e8e8;
}

div.cartlinecheck {
	width: 8%;
}

@media screen and (max-width:770px) {
	div.recptbody{
		font-size: 0.75em;
	}
	div.cartcontentsdiv {
		font-size: 0.75em;
	}
}

div.cartgrandtotaltext, div.cartgrandtotal {
	font-size: 1em;
}

div.cart3servicecommitment{
	/* hides date/time estimate */
	display:none;
}



.checkshippingbox {
	text-align:center;
	color: black;
	/*padding-bottom: 5px;
	padding-top: 5px;*/
	padding: 10px 0px 10px 0px;
	clear: both;
	background-color: #fff;
	border-top: 1px solid #ccc;
}

.cart2subheader {
	background-color: #fff;
	padding: 0px 0px 12px 0px;
}

.cart2subheaderborder {
	border-top: 1px solid #ccc;
}

.cdformtitle {
	font-size: 1.25em;
	padding:0px 0px 10px 6px;
}

.mccartnote {
    color:#027700;
    text-align: center;
}

@media screen and (max-height:580px){
	.kjErrDesc h3{
		font-size: 10pt;
	}
}

/*For buttons, first override the ect css*/
input.ectbutton {
    background:#36c;
	border-radius: 2px;
	font-family: Verdana, sans-serif;
	font-size: 16px;
	margin: 6px 0px 0px 0px;
	padding: 5px 20px 5px 20px;
	border: solid #707070 1px;
	text-decoration: none;
    cursor: pointer;
    box-shadow: 1px 1px 2px #888;
}

input.ectbutton:hover:disabled {
    background:#ddd;
}

a.ectbuttonlink {
	-webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
	background:#36c;
	border-radius: 2px;
	font-family: Verdana, sans-serif;
	font-size: 16px;
	margin: 6px 0px 0px 0px;
	padding: 5px 20px 5px 20px;
	border: solid #707070 1px;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 1px 1px 2px #888;
	color:white
}
input.ectbutton:hover,a.ectbuttonlink:hover {
    background: #38f;
}




/*.ectbutton, input.ectbutton, button.ectbutton {
    background: #8e8;
    background-image: none;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#8e8), to(#4b4));
	background-image: -o-linear-gradient(top, #8e8, #4b4);
	background-image: linear-gradient(to bottom, #8e8, #4b4);
    color:#000;
    border: solid #707070 1px;
    border-radius: 2px;
    font-family:Verdana,Tahoma,sans-serif;
    font-size: 16px;
	margin: 6px 0px 0px 0px;
	padding: 5px 20px 5px 20px;
	text-decoration: none;
	cursor: pointer;
}

.ectbutton:hover, input.ectbutton:hover, button.ectbutton:hover {
    background: #4b4;
    color:#000;
    border: solid #707070 1px;
}*/


/*gradient*/
/*
.buybutton, input.buybutton, button.buybutton {
	background: #8e8;
	background-image: none;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#8e8), to(#4b4));
	background-image: -o-linear-gradient(top, #8e8, #4b4);
	background-image: linear-gradient(to bottom, #8e8, #4b4);
	border-radius: 2px;
	font-family: Verdana, sans-serif;
	color: #000000;
	font-size: 16px;
	margin: 6px 0px 0px 0px;
	padding: 5px 20px 5px 20px;
	border: solid #707070 1px;
	text-decoration: none;
	cursor: pointer;
}

.buybutton:hover, input.buybutton:hover, button.buybutton:hover {
    background: #4b4;
    color: #000;
}
*/


/*Flat Design*/
/*8e8 seemed too light  66da66*/
.buybutton, input.buybutton, button.buybutton, input.checkoutbutton {
	background: #6d6;
	border-radius: 2px;
	font-family: Verdana, sans-serif;
	color: #000000;
	font-size: 16px;
	margin: 6px 0px 0px 0px;
	padding: 5px 20px 5px 20px;
	border: solid #707070 1px;
	text-decoration: none;
	cursor: pointer;
}

.buybutton:hover, input.buybutton:hover, button.buybutton:hover, input.checkoutbutton:hover {
    background: #4b4;
    color: #000;
}


/*PLACE ORDER*/
input.checkoutbutton3 {
    background: #fa2;
    padding: 10px 20px 10px 20px;
    color: #000;
}

input.checkoutbutton3:hover {
    background: #f60;
}

input.cartlineupdate {
    padding: 4px 6px;
    font-size: 14px;
}


    
li.TabbedPanelsTab {
    font-family: Verdana, Tahoma, sans-serif;
}

.sclinks {
    text-align:right;
    padding:3px;
}

div.cartcontentsdiv {
    font-family:Verdana,Helvetica,sans-serif;
}


div.ectdivhead, div.cart4header {
    padding:2px;
    color: #FFF;
    /*font-size: 16px;*/
    text-shadow: 1px 1px 1px #333;
    background: #36c;
}

div.cart4header {
    padding:6px 2px;
}

div.checkoutstep {
    visibility:hidden;
}

div.cart1details, div.cart2details, div.cart3details {
    font-family: Verdana,Helvetica,sans-serif;}


.billformrow, .nohidebillrow, .shipformrow, .cart4row {
    border-top: 1px solid #ccc;
}

.cobhl2 {
	/*background-color:#ebebeb;*/
}

div.shipaltrates {
    border: 0px;
    border-radius:0px;
    /*margin: 0px;*/
}

div.cart3shipselrow {
    background: #e8e8e8;
}

div.cart3shipping {
    /*padding-bottom: 12px;*/
    padding: 6px 0px;
}

div.ALAddContainer{
    padding: 10px;
}

div.editaddressbuttons{
	width:100%;
}

.kjcarthdr {
	font-size: 24px;
	/* text-align: left; */
	font-weight: bold;
	background-color: #fff;
	padding: 0px 0px 4px 4px;
}
/* do we want this?, add this wrapper div around the two cartcheckoutsavedaddr divs */
/* @media all and (min-width: 940px){
	.ALAddressContainer > div{
		width: 49%;
		float:left;
	}

} */

div.cdaddflag {
    font-size: 1em;
}

div.cartresumecontents {
    border:none;
    margin: 10px 0px;
    padding: 10px 0px;
}



div.cartloginbuttons {
    /*display: flex;*/
    text-align: center;
    float:none;
}

div.cartloginlogin, div.cartloginnewacct {
    width: auto; /* override V */
    margin-right: 10px;
    float: unset;
}

div.cartloginlogin {
    margin-right: 10px;
}

@media screen and (max-width: 480px) {
div.cartloginnewacct {
    display: block;
}
}


div.cart3shippingmc {
    text-align: right;
}
@media screen and (max-width: 480px) {
.cart3shippingmc2 {
    display: none;
}
}


/* New spinner from https://tobiasahlin.com/spinkit/ */
.sk-chase {
    margin: 100px auto;
  width: 96px;
  height: 96px;
  animation: sk-chase 8s infinite linear both;
}

.sk-chase-dot {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0; 
  animation: sk-chase-dot 2.0s infinite ease-in-out both; 
}

.sk-chase-dot:before {
  content: '';
  display: block;
  width: 25%;
  height: 25%;
  background-color: #36c;
  border-radius: 100%;
  animation: sk-chase-dot-before 2.0s infinite ease-in-out both; 
}

.sk-chase-dot:nth-child(1) { animation-delay: -1.1s; }
.sk-chase-dot:nth-child(2) { animation-delay: -1.0s; }
.sk-chase-dot:nth-child(3) { animation-delay: -0.9s; }
.sk-chase-dot:nth-child(4) { animation-delay: -0.8s; }
.sk-chase-dot:nth-child(5) { animation-delay: -0.7s; }
.sk-chase-dot:nth-child(6) { animation-delay: -0.6s; }
.sk-chase-dot:nth-child(1):before { animation-delay: -1.1s; }
.sk-chase-dot:nth-child(2):before { animation-delay: -1.0s; }
.sk-chase-dot:nth-child(3):before { animation-delay: -0.9s; }
.sk-chase-dot:nth-child(4):before { animation-delay: -0.8s; }
.sk-chase-dot:nth-child(5):before { animation-delay: -0.7s; }
.sk-chase-dot:nth-child(6):before { animation-delay: -0.6s; }

@keyframes sk-chase {
  100% { transform: rotate(360deg); } 
}

@keyframes sk-chase-dot {
  80%, 100% { transform: rotate(360deg); } 
}

@keyframes sk-chase-dot-before {
  50% {
    transform: scale(0.4); 
  } 100%, 0% {
    transform: scale(1.0); 
  } 
}