/* helpers.css */

/* spacing helpers
p,m = padding,margin
a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
Nicole Sullivan made these for Facebook
*/

.ptn,.pvn,.pan{padding-top:0px !important}
.pts,.pvs,.pas{padding-top:5px !important}
.ptm,.pvm,.pam{padding-top:10px !important}
.ptl,.pvl,.pal{padding-top:20px !important}
.prn,.phn,.pan{padding-right:0px !important}
.prs,.phs,.pas{padding-right:5px !important}
.prm,.phm,.pam{padding-right:10px !important}
.prl,.phl,.pal{padding-right:20px !important}
.pbn,.pvn,.pan{padding-bottom:0px !important}  
.pbs,.pvs,.pas{padding-bottom:5px !important}
.pbm,.pvm,.pam{padding-bottom:10px !important}
.pbl,.pvl,.pal{padding-bottom:20px !important}
.pln,.phn,.pan{padding-left:0px !important}
.pls,.phs,.pas{padding-left:5px !important}
.plm,.phm,.pam{padding-left:10px !important}
.pll,.phl,.pal{padding-left:20px !important}
.mtn,.mvn,.man{margin-top:0px !important}
.mts,.mvs,.mas{margin-top:5px !important}
.mtm,.mvm,.mam{margin-top:10px !important}
.mtl,.mvl,.mal{margin-top:20px !important}
.mrn,.mhn,.man{margin-right:0px !important}
.mrs,.mhs,.mas{margin-right:5px !important}
.mrm,.mhm,.mam{margin-right:10px !important}
.mrl,.mhl,.mal{margin-right:20px !important}
.mbn,.mvn,.man{margin-bottom:0px !important}  
.mbs,.mvs,.mas{margin-bottom:5px !important}
.mbm,.mvm,.mam{margin-bottom:10px !important}
.mbl,.mvl,.mal{margin-bottom:20px !important}
.mln,.mhn,.man{margin-left:0px !important}
.mls,.mhs,.mas{margin-left:5px !important}
.mlm,.mhm,.mam{margin-left:10px !important}
.mll,.mhl,.mal{margin-left:20px !important}

/*these are new shared styles we've added*/

body.email {
	background: #fff url(../assets/mm-images/cleardot.gif) top left repeat;
}

.mmEven {
  background-color: #ffffff; 
}

.mmOdd {
  background-color: #f9f9f9;
}

.table tbody > tr.mm-optionrow > td, .table tbody > tr.mm-optionrow > th {
	border-top: none;
	vertical-align: middle;
	padding-bottom: 0px;
}


.mm-li-2{ /*make an ul list 2 columns*/
-moz-column-count: 2;
-moz-column-gap: 30px;
-webkit-column-count: 2 ;
-webkit-column-gap: 30px;
column-count: 2;
column-gap: 30px;
column-count:2
}

.mm-li-3{ /*make an ul list 3 columns*/
-moz-column-count: 3;
-moz-column-gap: 30px;
-webkit-column-count: 3;
-webkit-column-gap: 30px;
column-count: 3;
column-gap: 30px;
column-count:3
}

.media-list { margin: 20px 0px; }

img.media-object-small {
	max-width: 60px;
	max-height: 60px;
}


.tab-content { padding-top: 20px; }
ul#nav li ul { margin-left: 0px; }
ul#nav li ul li { margin: 0; padding: 0; }
ul#nav ul { margin:0; padding: 0; }

.blurb img { max-width: 100%; }
.sblurb { font-size: 85%; }

.mm-products ul.pagination { margin-left: 20px; }

/* payment table */



#payment_table > tbody > tr > th, #payment_table > tbody > tr > td { border-top: 0; }

#payment_table > tbody > tr > td > div > table > tbody > tr > td { border-top: 0; }

/*.pmt_table > tbody > tr > th { padding-top: 20px; }
.pmt_table > tbody > tr > th:first-child { padding-top: 0px; }*/


.pmt_table > tbody > tr > th.h3 { padding-top: 20px; }
.pmt_table > tbody > tr:first-child > th.h3:first-child { padding-top: 0px; }

/* price_table */

table.price_table {	margin: 10px 0px; }
table.price_table tr th, table.price_table tr td {
	padding: 5px;
  line-height: 1.428571429;
  vertical-align: top;
  border: 1px solid #dddddd;
}
table.price_table tr th { 
	vertical-align: bottom;
}

/* Item */

.mm-products .row.items { margin: 0;}

.items > .col-sm-2:nth-child(7n+0) { margin-left: 0; }
.items > .col-sm-3:nth-child(4n+1) { margin-left: 0; }
.items > .col-sm-4:nth-child(3n+1) { margin-left: 0; }
.items > .col-sm-6:nth-child(odd) { margin-left: 0; }
.items > .col-sm-12:nth-child(2n+0) { margin-left: 0; }

.item .item-price { float: left; } /*for backward compatibility*/
.item a.btn { float: right; } /*for backward compatibility*/
.item .item-sale { text-align: center; } /*for backward compatibility*/
.mm-quickorder_3up .item, .mm-search .item.quickorder_3up, .item.quickorder_3up { text-align: center; }
.mm-quickorder_3up .item .item-price, .mm-search .item.quickorder_3up .item-price, .item.quickorder_3up .item-price {
	float: none;
	margin-bottom: 10px;
}
.mm-quickorder_3up .item .input-group, .mm-search .item.quickorder_3up, .input-group, .item.quickorder_3up .input-group { margin: 0 auto;  }

/* this is used on some sites to get the multiheader to display on its own line, but has been replaced by class of multiheader col-xs-12 clearfix*/
.item.multiheader { float: left; border: 0px; padding: 0px; box-shadow: none; width: 100%; }
.item.multiheader:hover { box-shadow: none; }




.blurb img { max-width: 100%; }
.blurb table { max-width: 100%; }
.blurb table td img { max-width: 100%; }

/* Social */
.socialicons2 {
	height: 50px;
}



.social .glyphicon {
box-shadow:inset 0px 0px 1px #333;
height:25px;
width:25px;
line-height:25px;
margin:0px 5px 0px 0px;
border-radius:3px;
color:#fff;
-webkit-transition:background 1s ease;
-moz-transition:background 1s ease;
-o-transition:background 1s ease;
transition:background 1s ease;
text-align:center;
}

.social {
font-family: 'Glyphicons Social';
vertical-align: top;
padding-left: 30px;
}


.social-facebook:before,.social.facebook:before {
color:#3c5b9b;
background: #fff;
border-radius: 3px;
}

.social.twitter:before{
color:#2daae1;
background: #fff;
border-radius: 3px;
}

.social.google_plus:before{
color:#f63e28;
background: #fff;
border-radius: 3px;
}

.social.pinterest:before{
color:#cb2027;
background: #fff;
border-radius: 3px;
}

.social.linked_in:before{
color:#0173b2;
background: #fff;
border-radius: 3px;
}

.social.yelp:before{
color:#c41200;
background: #fff;
border-radius: 3px;
}

.social.youtube:before {
  color: #ff0000;
background: #fff;
border-radius: 3px;
}

.social.instagram:before {
    color: #e3dcc9;
background: #000;
border-radius: 3px;
}

.social glyphicon:hover{
/*background:#000;*/
-webkit-transition:background 1s ease;
-moz-transition:background 1s ease;
-o-transition:background 1s ease;
transition:background 1s ease;
}

.social a,.social a:visited,.social a:hover{
color:#fff;
text-decoration:none;
}

img.socialimg { max-height: 20px; }




/* Back to top */

.totop {
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 104400;
}

.totop a, .totop a:visited{
	display: block;
	width: 30px;
	height: 30px;
	color: #fff;
	text-align: center;
	line-height: 30px;
}

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

/* This is for the maps and general iframes in redactor */

.mm-columns iframe { max-width: 100%; }

#map_canvas { width: 600px; height: 400px; }


@media (min-width:600px) and (max-width:599px) {
	#map_canvas, iframe { width: 400px; height: 267px; }
}

@media (max-width:599px) {
	#map_canvas, iframe { width: 300px; height: 200px; }
	.blurb img { max-width: 100%; width: 100%; height:auto; }
	iframe[name="google_conversion_frame"] { height: 10px; }
	
}

/* This is for the full-width title in some skins */

.mm-accounts > h1.fullwidth { display: none; }

/* this is so the qty input on viewcart is big enough for lg numbers */

.mm-cart input.input-width-md { width: 70px; }

/* phone size stuff */

@media (max-width:600px) {
	/* this is for the mobile wrapper */
	.mobilewrapper {
		position: relative;
  	left: 0 !important;
		overflow-y: scroll;
	}
	/* this makes long urls break so you don't need to scroll */
	a {	word-wrap: break-word; }
	
	/*to make submit buttons full-width in cart*/
	.mm-cart .btn-primary, #mm_expresscheckout { display: block; width: 100%; }
	 
}

/* This is so the urls from hrefs won't display in print preview */

@media print {
  a[href]:after {
    content: "";
  }
}

/* This is to make img-responsive work in FF under 600px */

@media (max-width:599px) {
    .logo .img-responsive, .logo img { max-width: 100%; width: 100%; height: auto; }
		#logo .img-responsive, #logo img { max-width: 100%; width: 100%; height: auto; }
		.blurb img { max-width: 100%; width: 100%; height: auto; }
}



@media (max-width:767px) {
	/* This is to make Element iframe tall enough on phone */
	#elementwrapper2 iframe { height: 400px; }
	/* this defaults the catblurb to hidden with a toggle button
	.catblurb { display: none; }*/
	
	
}

@media (max-width:600px) {
	table.pmt_table { width: 100%; }
	input.btn[value=Continue] { float: left; }
	input.btn[value=Continue]::after { clear: both; }
	#before_submit { text-align: left; }
}

/* to add the asterisk after label for required fields*/
.reqlabel:after {
	content: "*";
	color: #990000;
}

/*default error class for required fields*/
label.error { color: #990000; }

/* for a button with no background or padding */
.btn.btn-plain { background: none; padding: 0; }
.btn.btn-plain:hover, .btn.btn-plain:active { background: none; }

@media (max-width:991px) {
	/* this is to move qty and price to own line on viewcart in accordian cart*/
	#mm-xsUnit { clear: both; }

}


@media (max-width:767px) {
	/*for hiding the order details on mobile until clicked */
	#mobiledetails { display: none; }
	/* this is to fix an issue with multiitems carousel height on iphone on Chrome */
	#carousel-multiitems .carousel img.img-responsive { height: 100px; width: auto; overflow: hidden; 		}
	#col-pqty .input-group-btn { display: block; white-space: normal; }
	
	
}

@media (max-width:600px) {
	
}

/* for removing left margin when category heading precedes a list */
@media (min-width:768px) {
	.mmlistheading { margin-left: -40px; }
}

/* for a css zoom-image */
.img-hover img {
    -webkit-transition: all .3s ease; /* Safari and Chrome */
  	-moz-transition: all .3s ease; /* Firefox */
  	-o-transition: all .3s ease; /* IE 9 */
  	-ms-transition: all .3s ease; /* Opera */
  	transition: all .3s ease;
}
.img-hover img:hover {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform:translateZ(0) scale(3.00); /* Safari and Chrome */
    -moz-transform:scale(3.00); /* Firefox */
    -ms-transform:scale(3.00); /* IE 9 */
    -o-transform:translatZ(0) scale(3.0); /* Opera */
    transform:translatZ(0) scale(3.00);
		position: relative;
		z-index: 2000;
		border: 1px solid #ddd;
}

.color, .text-highlight { color: #990000; }

/*--Five-across responsive layout--*/

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

/* This is to prevent the text fields from zooming on mobile */
@media (max-width:767px) {
	input, textarea, select, input.form-control, textarea.form-control, select.form-control { font-size: 16px; }
}

/* to center the sharethis widget */
.text-center .addthis_default_style a[class*="addthis"] { float: none !important; }

/*set max size for viewcart image*/
#viewcart_form #col-pimage img { width: auto; max-height: 100px; }