/* CSS Document */

/***********************************************/
/*************PAGE STYLES***********************/
/***********************************************/

h1 {
font-family: "quatro-slab" !important;
line-height: 45px !important;
}

h2 {
font-family: "quatro-slab" !important;
}

h3 {
font-family: "quatro-slab" !important;
}

h4 {
font-family: "quatro-slab" !important;
}

.row {
position: relative;
}

a {
	cursor: pointer !important;
}

.btn-primary {
	background-color: #0581F4 !important;
	border-color: #0581F4 !important;
}

.m-open {
	color: #80A963;
}

.c-list ul {
	padding: 0 !important;
	font-size: 16px;
	line-height: 30px;
}

/***********************************************/
/*************QUICKLINKS************************/
/***********************************************/

.quicklinks {
background-color: #fff;
height: 35px;
border-bottom: 1px solid #ddd;
}

.default {
background-color: rgba(0, 0, 0, 0) !important;
border: none !important;
color: #257fe2;
}


/***********************************************/
/*************HELP STYLES***********************/
/***********************************************/

.line-break {
	border-bottom: 1px solid #ccc;
	margin: 20px 0;	
}

.badge {
	background-color: #337AB7;	
}


/***********************************************/
/*************HEADER****************************/
/***********************************************/

.header	{
	background-image: url("/images/outerwrap_top.jpg");
	background-position: center;
}

.logo {
	margin-top: -13px;
	margin-bottom: -11px;
}

.logo a {
font-family: "bad-dog";
font-size: 96px;
color: #0581F4 !important;
margin-top: 10px;
text-decoration: none !important;
}

.search {
margin-top: 35px;
}

/*********************************************************/
/*************NAV BAR*************************************/
/*********************************************************/
.navbar-bg {
	background-color: #0581F4;
}
.brand-nav {
	float: left;
	border: 1px solid #ddd;
	margin: 30px 12px -10px;
	width: 14%;
}

a.nav-expander {
background: none repeat scroll 0 0 #000000;
color: #FFFFFF;
display: block;
font-size: 15px;
font-weight: 400;
height: 50px;
margin-right: 0;
padding: 1em 1.6em 2em;
position: absolute;
left: 0;
text-decoration: none;
text-transform: uppercase;
top: 0;
transition: left 0.3s ease-in-out 0s;
width: 130px;
z-index: 12;

transition: left 0.3s ease-in-out 0s;
-webkit-transition: left 0.3s ease-in-out 0s;
-moz-transition: left 0.3s ease-in-out 0s;
-o-transition: left 0.3s ease-in-out 0s;
}

a.nav-expander:hover {
cursor: pointer;
}

a.nav-expander.fixed {
position: fixed;
}

.nav-expanded a.nav-expander.fixed {
left: 20em;
}

nav {
background: #fff;
display: block;
height: 100%;
overflow: auto;
position: fixed;
left: -20em;
font-size: 15px;
top: 0;
width: 20em;
z-index: 2000;

transition: left 0.3s ease-in-out 0s;
-webkit-transition: left 0.3s ease-in-out 0s;
-moz-transition: left 0.3s ease-in-out 0s;
-o-transition: left 0.3s ease-in-out 0s;

}
.nav-expanded nav {
left: 0;
}

body.nav-expanded {
margin-left: 0em;
transition: left 0.4s ease-in-out 0s;
-webkit-transition: left 0.4s ease-in-out 0s;
-moz-transition: left 0.4s ease-in-out 0s;
-o-transition: left 0.4s ease-in-out 0s;
}

.nav-close {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight: 300;
font-size: 24px;
padding-right: 10px;
}

.sub-nav-m {
background-color:  #fff;
}

.sub-sub-nav-m {
background-color:  #fff;

}

.navbar-toggle{
border: none;
}

.navbar-default .navbar-toggle .icon-bar {
background-color: #fff;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
background-color: transparent;
}

.main-menu {
padding-top: 12px;
}

.main-menu li {
border-bottom: 1px solid #ddd;
font-size: 18px;
padding: 12px;
}

.main-menu li a {
color: #666;
text-decoration: none;
margin-left: 20px;
}

.main-menu li a:hover {
color: #257fe2;
text-decoration: none;
}

.main-menu li .sub-nav {
border-bottom: 0px;
padding: 4px;
}

.main-menu a .caret {
width: 0;
height: 0;
display: inline-block;
vertical-align: top;
border-top: 4px solid #4f5963;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
margin-top: 8px;
}

.main-menu a:hover .caret {
border-top-color: #4f5963;
}

.main-menu li.open > a > .caret {
border-top: none;
border-bottom: 4px solid #4f5963;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}

.main-menu li.open > a:hover > .caret {
border-bottom-color: #4f5963;
}

.welcome{
color: #257fe2;
}

.icon:before {
font-family: 'FontAwesome';
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 1;
text-transform: none;
content: '\f105';
}

.main-menu li > a > span.icon {
float: left;
margin: 0.1em 1.7em -0.1em 0;
opacity: 0;

}

.main-menu li > a:hover > span.icon {
opacity: 1;
}

.mega-menu {
color: #0581F4;
display: block;
overflow: hidden;
font-family: "quatro-slab",serif;
font-size: 16px;
}

.mega-menu ul {
margin: 0;
padding: 0;
}

.mega-menu ul li {
display: inline-block;
list-style-type: none;

-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-ms-transition: all 0.2s;
-o-transition: all 0.2s;
transition: all 0.2s; 
}

.mega-menu > ul > li > a > .caret {
border-top: 4px solid #0581F4;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
content: "";
display: none;
height: 0;
width: 0;
vertical-align: middle;

-webkit-transition: color 0.1s linear;
-moz-transition: color 0.1s linear;
-o-transition: color 0.1s linear;
transition: color 0.1s linear; 
}

.mega-menu > ul > li > a {
color: #fff;
display: block;
line-height: 56px;
padding: 0 19px;
text-decoration: none;
border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.mega-menu > ul > li:hover {
background-color: #016bcd;
}

.mega-menu > ul > li:hover > a {
color: rgb( 255, 255, 255 );
}

.mega-menu > ul > li:hover > a > .caret {
border-top-color: rgb( 255, 255, 255 );
}

.mega-menu > ul > li > .wdiv {

margin: 0;
opacity: 0;
position: absolute;
width: 100%;
visibility: hidden;
z-index: 100;
left: 0;
height: auto;

-webkit-transiton: opacity 0.2s;
-moz-transition: opacity 0.2s;
-ms-transition: opacity 0.2s;
-o-transition: opacity 0.2s;
-transition: opacity 0.2s;

padding: 0 15px 35px;
font-size: 14px;
text-align: left;
list-style: none;
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0,0,0,.15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
box-shadow: 0 6px 12px rgba(0,0,0,.175);

}

.mega-menu > ul > li:hover > .wdiv {
display: block;
opacity: 1;
visibility: visible;
}

.mega-menu > ul > li > .wdiv ul {
-webkit-column-count: 5; /* Chrome, Safari, Opera */
-moz-column-count: 5; /* Firefox */
column-count: 5;
}


.mega-menu > ul > li > .wdiv ul > li {
-webkit-column-break-inside:avoid;
-moz-column-break-inside:avoid;
-o-column-break-inside:avoid;
-ms-column-break-inside:avoid;
column-break-inside:avoid;

}

.mega-menu > ul > li > div ul > li > a {
display: block;
padding: 7px 24px;
}

.mega-menu > ul > li > div ul > li:hover > a {
background-color: rgba( 255, 255, 255, 0.1);
}

/**************************************************************/
/*************CART DROPDOWN************************************/
/**************************************************************/

.pAddToCart:hover {
opacity: 0.80;	
}

.percentage-off {
color:red;
padding-left: 10px;
}

.percentage-off-d {
color:red;
text-align: center;
font-weight: bold;
margin: 10px 0;
font-size: 16px;
}

.c-img {
height: 50px;
width: 50px;
background-color: #000;
float: left;	
margin-bottom: 20px;
}

.c-text {
font-size: 11px;
float: left;
width: 100px;
margin-left: 8px;
}

.c-qty {
font-size: 12px;
font-weight: bold;
width: 50px;
float: left;
margin-left: 8px;
}

.cart-qty {
width: 20px;
height: 20px;	
}

.c-price {
float: left;	
margin-left: 10px;
}

#c-total {
width: 100%;
text-align:right;
font-weight: bold;
}

#c-error {
background-color: #ff9393;
border: 1px solid #ff4343;
width: 97%;
float:left;	
font-size: 12px;
padding: 5px;
margin-top: 5px;
}

#c-proceed {
width: 101%;
color: #fff !important;
background-color: #53C6C0;
-moz-box-shadow: 0px 0px 2px #686868; /* FF3.5+ */
-webkit-box-shadow: 0px 0px 2px #686868; /* Saf3.0+, Chrome */
box-shadow: 0px 0px 2px #686868;	/* Opera 10.5, IE9, Chrome 10+ */
text-align: center;
font-family: 'quicksandbold';
font-size: 20px;
border: 0;
height: 25px;
float:left;
margin-top: 10px;
cursor: pointer;
}

.c-remove {
height: 20px;
width: 20px;
float:right;
cursor: pointer;
}

.cart-popup {
height: auto;
width: 900px !important;
margin: auto;
padding: 20px;
background-color: #fff !important;
}

.cart-button {
background: url(images/cart-button.jpg) repeat-x;
height: 37px;
color: #fff;
font-family:'marydaleregular';	
text-align: center;
padding: 2px 25px;
font-size: 20px;
cursor: pointer;
}
.cart-btn {
padding: 33px 0 0;
font-family: "quatro-slab",serif;
}

.c-btn a:focus, a:hover{
text-decoration: none !important;
}

.nav-btn {
color: #0581F4 !important;
width: 100%;
background: transparent !important;
border-radius: 0 !important;
margin-top: 4px;
font-size: 22px !important;
}

.c-dd {
width: 400px;
right: 0 !important;
left: inherit !important;
padding: 20px !important;
}

.item img{
margin: auto;
}


.c-table {
	border-bottom: 1px solid #ddd !important;	
}

.c-table tr td{
	padding: 10px;
}

/*********************************************************/
/*************MOBILE STYLES*******************************/
/*********************************************************/

.navbar-default .navbar-nav>li>a {
color: #fff;
}
.navbar-default {
background-color: transparent !important;
border-color:  transparent !important;
border-radius: 0;
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
background-color: transparent !important;
border-color:  transparent !important;
}

.navbar-default .navbar-nav>li>a {
font-size: 18px;
padding: 50px 20px;
font-family: "quatro-slab",serif;
}

.m-logo {
font-family: "bad-dog" !important;
font-size: 40px !important;
color: #0581F4 !important;
text-decoration: none !important;
}



/*********************************************************/
/*************CAROUSEL************************************/
/*********************************************************/

.carousel-control.right {
background-image: none !important;
}

.carousel-control.left {
background-image: none !important;
}

.carousel {
	margin-top: 10px;
}
/*********************************************************/
/*************BANNER**************************************/
/*********************************************************/

.banner {
	color: #fff;
	padding: 10px 0;
	background-color: #E82A92;
	text-align: center;
	font-size: 18px;
	font-family: "quatro-slab",serif;
}

/*********************************************************/
/*************ORDER BY************************************/
/*********************************************************/

.orderby {
	margin: 10px 0 0 0 !important;
	text-align: center;
	font-family: "quatro-slab",serif;
	font-size: 20px;
	background-color: #fff !important;
	color: #f59602 !important;
	padding: 15px 0;
}

.orderby-table {
	margin: auto;
}

.orderby-table td{
	padding: 10px;
}

.truck {
	height: 40px;
}

#cntdwn {
	background-color: #fff !important;
	color: #f59602 !important;
}

/***********************************************/
/*************HOME PAGE*************************/
/***********************************************/

#slides-full {
    width: 100%;
    background-color: #fff;
}

#slides {
    width: 100%;
    z-index: 10;
	text-align: center;
}

#slides img {
	width: 100%;
}

.c-wrap {
position: relative;
display: table;
 -webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;

}

.home-title {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-family: "quatro-slab" !important;
}

.category-img {
width: 100%;
}

.c-wrap:hover {
opacity: 0.8;
}

.home-title span {
display: table;
height: 100%;
width: 100%;
}

.home-title h1	{
display: table-cell;
vertical-align: middle;
text-align: center;
font-size: 35px;
text-transform: uppercase;
line-height: 100%;
color: #fff;
}

.home-title span p	{
text-align: right;
font-size: 12px;
line-height: 100%;
color: #fff;
bottom: 0;
right: 20px;
position: absolute;
}


/***********************************************/
/*************INSTAGRAM*************************/
/***********************************************/

.insta {
text-align: center;
margin-top: 50px;
margin-bottom: 20px;
}


/*******************************************************/
/*************NEWSLETTER SIGN UP************************/
/*******************************************************/

.newsletter {
background-color: #0581F4;
margin: 50px 0 0 0;
padding: 20px 0;
color: #fff;
}

.newsletter h2 {
margin: 0;
padding: 0;
}

.newsletter-btn {
background-color: #0581F4 !important;
border: 1px solid #fff !important;
color: #fff !important;
-webkit-transition: background-color 0.3s ease-in-out;
-moz-transition: background-color 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out;
}

.newsletter-btn:hover {
background-color: #fff !important;
border: 1px solid #0581F4 !important;
color: #0581F4 !important;
}

/****************************************************************/
/*************BLOG & PET OF THE DAY******************************/
/****************************************************************/

.pod {
position: absolute;
top: -30px;
right: 0;
width: 25%;
}

.blog {
padding: 0 5px !important;
}

.btn-outline {
background-color: #fff !important;
border: 1px solid #0581F4 !important;
color: #0581F4 !important;
-webkit-transition: background-color 0.3s ease-in-out;
-moz-transition: background-color 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out;

}

.btn-outline:hover {
background-color: #0581F4 !important;
border: 1px solid #fff !important;
color: #fff !important;
}

/*********************************************************/
/*************EXTRA SALE BOXES****************************/
/*********************************************************/

.sale-box {
border: 1px solid #ddd;
height: auto;
margin-bottom: 10px;
 -webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
-o-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;	
}

.sale-box:hover {
	opacity: 0.8;
}

.sale-box img {
	width: 100%;
}

.extras {
margin-top: 40px;
text-align: center;
}

/*********************************************************/
/*************SEO TEXT************************************/
/*********************************************************/

.seo-text {
	margin-top: 20px;
	text-align: center;
}

/*********************************************************/
/*************FOOTER**************************************/
/*********************************************************/

.icons a img{
width: 10%;
margin-right: 10px;
}

.footer-ul {
list-style: none;
margin: 0;
padding: 0;
line-height: 24px;	
font-size: 12px;
}

.footer-ul a {
color: #232323 !important;	
}

.title-box {
padding: 15px 0;
margin-bottom: 10px;
font-weight: bold;
font-size: 12px;
color: #232323;
}

/*********************************************************/
/*************DRAWER**************************************/
/*********************************************************/

.drawer {
position:relative;
min-height:475px;
background: #fff;
width:100%;
bottom:0px;
margin-bottom: -475px;
z-index: 1000;
}

.promo-slide {
background-color: #fff;
}

.drawer-btn {
position:relative;
bottom: 41px;
z-index: 2000;
visibility: visible;
}

.drawer-btn-style {
position: relative;
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
border: none !important;
font-family: "quatro-slab",serif;
font-size:  16px !important;
background-color: #0581f4 !important;
color: #fff !important;
-webkit-box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.4);
box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.4);
width: 500px;
margin: 0 auto;
}

.drawer-btn-wrap {
position: relative;
margin: 0 auto;
width: 500px;	
}

.drawer-btn-style:hover {
background-color: #0581F4 !important;
}

.drawer-btn-style:focus {
background-color: #0581F4 !important;
outline: none !important;
border: none !important;
}

.drawer-btn-style:active {
outline: none !important;
border: none !important;
}
.deals {
padding-left: 8px !important;
padding-right: 8px !important;
text-align: center;
}


/*********************************************************/
/*************LIST PAGE**************************************/
/*********************************************************/

.star-sprite-a {
    background: url(/images/star-sprite.jpg) no-repeat;
    width: 36px;
    overflow: hidden;
    height: 32px;
    float: left;
    margin: 0 5px;
    background-position: -40px;
}

.star-sprite-i {
    background: url(/images/star-sprite.jpg) no-repeat;
    width: 36px;
    overflow: hidden;
    height: 32px;
    float: left;
    margin: 0 5px;
}

#live-review {
	border: 1px solid #D1D1D1;
	height: 137px;
	width: 470px;
	margin-bottom: 15px;
}

.products {
	background-color: #fff;	
	height: auto;
}

/* grid */

.grid_1 {
	text-align:center;
}

.grid_2 {
	text-align:center;
}

.new-overlay {
	position: absolute;
	left: 20px;
	top: 10px;
}

.sale-overlay {
	position: absolute;
	top: 10px;
	left: 10px;	
}

.freeship-overlay {

	font-size: 16px;
	font-weight:normal;

}

.soldout-overlay {
	position: absolute;
	left: 10px;
	top: 40px;
}

.coming-soon-overlay {
	position: absolute;
	right: 10px;
	top: 10px;
}

.sidenav-v{
	color: #80A963;
	float: right;
}


.pText {
	text-decoration: none;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	font-weight: bold;
	margin-bottom: 10px;
}

.pText:hover {
	color: #EE9613 !important;
	text-decoration: underline;
}

.pPrice-d {
	color: red;
	font-weight:bold;	
	font-size:16px;
	padding-left: 10px;
}

.pOriginal-d {
	color:#000;
	font-size:16px;
	text-decoration: line-through;
	font-weight:bold;
}

.pPrice {
	color: red;
	font-weight:bold;	
	font-size:16px;
}

.pOriginal {
	color:#000;
	font-size:16px;
	text-decoration: line-through;
	font-weight:bold;

}

.pName-d {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;	
}


.pAddToCart:hover {
	opacity: 0.80;	
}

.percentage-off {
	color:red;
	padding-left: 10px;
}

.percentage-off-d {
	color:red;
	text-align: center;
	font-weight: bold;
	margin: 10px 0;
	font-size: 16px;
}

	.c-img {
		height: 50px;
		width: 50px;
		background-color: #000;
		float: left;	
		margin-bottom: 20px;
	}
	
	.c-text {
		font-size: 11px;
		float: left;
		width: 100px;
		margin-left: 8px;
	}
	
	.c-qty {
		font-size: 12px;
		font-weight: bold;
		width: 50px;
		float: left;
		margin-left: 8px;
	}
	
	.cart-qty {
		width: 20px;
		height: 20px;	
	}
	
	.c-price {
		float: left;	
		margin-left: 10px;
	}
	
	#c-total {
		width: 100%;
		text-align:right;
		font-weight: bold;
	}
	
	#c-error {
		background-color: #ff9393;
		border: 1px solid #ff4343;
		width: 97%;
		float:left;	
		font-size: 12px;
		padding: 5px;
		margin-top: 5px;
	}
	
	#c-proceed {
		width: 101%;
		color: #fff !important;
		background-color: #53C6C0;
		-moz-box-shadow: 0px 0px 2px #686868; /* FF3.5+ */
		-webkit-box-shadow: 0px 0px 2px #686868; /* Saf3.0+, Chrome */
		box-shadow: 0px 0px 2px #686868;	/* Opera 10.5, IE9, Chrome 10+ */
		text-align: center;
		font-family: 'quicksandbold';
		font-size: 20px;
		border: 0;
		height: 25px;
		float:left;
		margin-top: 10px;
		cursor: pointer;
	}
	
	.c-remove {
		height: 20px;
		width: 20px;
		float:right;
		cursor: pointer;
	}
	
	.cart-popup {
		height: auto;
		width: 900px !important;
		margin: auto;
		padding: 20px;
		background-color: #fff !important;
	}
	
	.popup-img {
		height: 380px;
		width: auto;
		float: left;	
	}

	.popup-img img {
		height: auto;
		width: 300px;
		float: left;	
	}
	
	.popup-text {
		width: 550px;
		height: auto;
		margin: 30px 0 30px 20px;
		float:left;
	}
	
	.popup-shipping {
		font-weight: bold;
		font-size: 14px;	
	}
	
	.pop-added {
		font-weight: bold;
		font-size: 24px;	
	}
	
	.pop-original {
		text-decoration: line-through;
		color: #666;
		font-size: 25px;
	}

	.pop-price {
		font-weight: bold;
		color: red;
		font-size: 25px;
		margin-left: 10px;
	}
	
	.pop-view {
		text-decoration: underline;
		font-size: 14px;
		font-family:'marydaleregular';	
		margin-left: 10px;
		cursor: pointer;
	}
	
	.upsell {
		float: left;
		margin-top: 2px;	
	}
	
	.cart-button {
		background: url(images/cart-button.jpg) repeat-x;
		height: 37px;
		color: #fff;
		font-family:'marydaleregular';	
		text-align: center;
		padding: 2px 25px;
		font-size: 20px;
		cursor: pointer;
	}


fieldset, label { margin: 0; padding: 0; }
body{ margin: 20px; }
h1 { font-size: 1.5em; margin: 10px; }

/****** Style Star Rating Widget *****/


.rating { 
  border: none;
	width: 140px;
	margin: auto;
}

.rating > input { display: none; } 
.rating > label:before { 
  margin: 5px;
  font-size: 1.25em;
  font-family: FontAwesome;
  display: inline-block;
  content: "\f005";
}

.rating > .half:before { 
  content: "\f123";
  float: left;
}

.rating > .half2:before { 
  content: "\f123";
}

.rating > label { 
  color: #ddd; 
 float: left; 
	margin-bottom: -5px;
}

.checked { color: #FFD700 !important;  } 

.review-count {
	font-size: 12px;
}

.flex-container {
  padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex:1 1 auto;
	
	-webkit-flex-flow: row wrap;
    align-content: flex-start;
	  
}

.flex-item {
	margin-bottom: 15px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex  ;
	padding: 15px 10px 30px;
	width:100%;
}

.flex-item-box {

	width:100%;
}


#blog.flex-container {
  padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex:1 1 auto;
	
	-webkit-flex-flow: row wrap;
    align-content: flex-start;
	  
}

#blog.flex-item {
	margin-bottom: 15px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex  ;
	padding: 15px 10px 30px;
	width:100%;
}


#personalize_wrap {
	height: 260px;
}

#personalize_text {
	text-align: center;
}



.top-category {
	text-align: center;
}

.top-category-box {
	border: 1px solid #ddd;
	border-radius: 4px;
	margin: 10px 0;
	padding: 10px 0;
}

.p-well {

    background-color: #fff;
    border: 1px solid #e3e3e3;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}

	.sideNav {
		width: 100%;
		height: auto;
		background: #fff;
		margin-top: 10px;
		margin-bottom: 20px;
		border: 1px solid #e3e3e3;
		border-bottom: none;
	}
	
	.sideNav a {
		text-decoration: none;
		color: #000;	
		line-height: 27px;
	}
	
	.sideNav a:visited {
		color: #000 !important;	
	}

	.sideNav a:hover {
		color: #E88E02 !important;	
	}

	
	#verticalDivider {
		display: block;
		width: 100%;
	}
	
	.tags {
		margin-bottom: 8px;
		background: url(images/sideNav-arrow.jpg) no-repeat right center;
		width: 100%;
	}

/* resultsBar */

	.resultsBar {
		width: 100%;
		height: auto;
		background: #fff;
		margin-top: 10px;
	}

	.resultTitle {
		width: 778px;
		margin: auto;
  	    font-family: 'marydaleregular';
		font-size: 25px;
		color: #F00;
	}

/* searchResults */

	.searchResults {
  	    font-family: 'marydaleregular';
		font-size: 25px;
		color: #000;
		text-align: left;
		padding: 5px 0;
	}
		

/* filters */

	.filterBar {
		width: 100%;
		margin: 0 auto 10px;
		padding: 15px;
		border: 1px solid #e3e3e3;
	}
	
	.filters {
		width: auto;
		float: left;
		margin-right: 20px;
	}
	
	.filters img{
		margin-left: 5px;
		margin-top: -2px;
	}
	
	.filter {
		background: url(images/filter-close-btn.jpg) no-repeat center left;
		height: 17px;
		padding-left: 25px;	
		padding-top: 2px;
	}
	
	.filter-name {
		font-weight: bold;
		margin-bottom: 5px;
		margin-top: 10px;
	}

/* sortBar */

	.category_banner img {
		width: 100%;
	}
	
	
	.tag-text {
		font-size: 16px;
		font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
		padding: 5px 0 5px 5px;	
	}

	.breadCrumb {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 11px;
		height: 20px;
		padding: 4px;
	}
	
	#breadcrumb {
		border: 1px solid #80A963;
		padding: 10px;
		width: 968px;	
	}
	
	.clear-all {
		font-size: 12px;
		font-weight: bold;
		padding: 6px;
		font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
		text-decoration: underline;
		cursor: pointer;
		color: #0485CB;
	}
	
	.narrow-wrap {
		width: 100%;
		height: auto;
	}
	
	.module {
		padding: 10px 20px 20px 20px;
		line-height: 20px;	
		/*border-bottom: 1px solid #80A963;*/
		width: 100%; 
		height: auto;
		border-bottom: 1px solid #e3e3e3;
	}
	
	.module-closed {
		padding: 10px 20px 0;
		line-height: 20px;	
		border-bottom: 1px solid #e3e3e3;
		width: 100%; 
		background-color: #fff;
		/*background-color: #80A963;*/
	}
	
	.module-name {
		font-size: 14px;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: bold;
		text-transform: uppercase;
		color: #80A963;
		margin-bottom: 10px;
		cursor: pointer;
			
	}

	.module-name-closed {
		font-size: 14px;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: bold;
		text-transform: uppercase;
		color: #80A963;
		margin-bottom: 10px;
		cursor: pointer;
			
	}
	
	.module a:hover {
		text-decoration: underline;	
		color: #80A963;
	}
	
	.zac_is_awesome {
		margin: 0;
		padding: 0;
	}

	.grassy-fg {
		width: 770px;
		height: 76px;
		z-index: 100;
		position: absolute;
	}



/*********************************************************/
/*************DRAWER**************************************/
/*********************************************************/


.drawer {
	position:fixed;
	min-height:475px;
	background: #fff;
	width:100%;
	bottom:0px;
	margin-bottom: -475px;
	z-index: 1000;


}

.promo-slide {
	background-color: #fff;

}


.drawer-btn {
	position:fixed;
	bottom: 475px;
	left: 42%;
	z-index: 2000;
	visibility: visible;

}

.drawer-btn-style {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border: none !important;
	font-family: "quatro-slab",serif;
	font-size:  16px !important;
	background-color: #0581F4 !important;
	color: #fff !important;
	width: 300px;
	-webkit-box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.2);
	box-shadow: 0px -2px 3px 0px rgba(0,0,0,0.2);

	}

.drawer-btn-style:hover {
	background-color: #0581F4 !important;
}
.drawer-btn-style:focus {
	background-color: #0581F4 !important;
	outline: none !important;
	border: none !important;
}

.drawer-btn-style:active {
	outline: none !important;
	border: none !important;
}

.caption {
text-align: center;

}

.col {
float: left;
width: 20%;
}

.h-name {
text-align: center;
font-family: "quatro-slab",serif;
font-size:  22px;
margin-top: -57px;

}

.home {
margin-bottom: 45px;
}

.product {
text-align: center;
font-size: 16px;
}

.price {
font-weight: bold;
color: red;
}

.sale {
font-weight: bold;
text-decoration: line-through;
}

.discount {
color: red;
font-weight: bold;
}

.measure {
	background-color: #0581F4 !important;
	color: #fff !important;
}

.zoom {
	display:inline-block;
	position: relative;
}

/* magnifying glass icon */
.zoom:after {
	content:'';
	display:block; 
	width:33px; 
	height:33px; 
	position:absolute; 
	top:0;
	right:0;
	background:url(/images/icon.png);
}

.zoom img {
	display: block;
}

.zoom img::selection { background-color: transparent; }

#ex2 img:hover { cursor: url(grab.cur), default; }
#ex2 img:active { cursor: url(grabbed.cur), default; }



/*********************************************************/
/*************CUSTOMER PHOTOS*****************************/
/*********************************************************/

				
.flex-container-cp {
  padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  justify-content: flex-start;
}

.flex-item-cp {
  padding: 5px;
  width: 285px;
  margin-top: 10px;

}

.cp-text {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 20px 0;
}


/*********************************************************/
/*************BRAND PAGE *********************************/
/*********************************************************/

.brand-letter {
	font-size: 120px;
	color: #ddd;
}
.brands-col {
	columns: 4;
	-webkit-columns: 4;
	-moz-columns: 4;
	text-decoration: none;
}

.brands-col li {
	list-style: none;
	padding: 10px 0;
}

.top-brand {
	text-align: center;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 15px;
}

/*********************************************************/
/*************ACCOUNT PAGES *******************************/
/*********************************************************/

.list-group-item.active {
    background-color: #0581F4 !important;
	border-color: #0581F4 !important;
	color: #fff !important;
}

.list-group-item.active a {
	color: #fff !important;
}

.profile-pic img {
	border-radius: 50%;
	width: 30%;
}


.refer-info {
	font-size: 12px;
	color: #fff;
	top: 125px;
	left: 420px;
	position: absolute;	
}

.refer-info a {
	color: #fff;
	cursor: pointer;
}

.icon-wrap {
	width: 100%;
	padding-top: 10px;
	text-align: center;
}

.deep-link {
	margin: 2px;
}

.personalize-wrap {
	margin-top: 20px;	
}

/*********************************************************/
/*************BLOG•••••• *********************************/
/*********************************************************/


.b-title {
	line-height: 45px;	
	font-weight: bold;
}

.b-title a {
	text-decoration: none;
	color: #7c7c7c !important;
}

.b-title a:hover {
	color: #0581F4 !important;
}


.b-text {
	font: normal 18px/28px 'Open Sans', Arial, sans-serif;	
	color: #7c7c7c !important;

}

.continue-reading {
	color: #0581F4 !important;
	border-color: #0581F4 !important;
	background-color: transparent !important;
}

.marydale {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 35px;
	font-family: 'marydaleregular';
	font-weight:normal;
	line-height: normal;
	clear: both;
	margin: 0 0 10px 0;
}

.no-results {
	text-align: center;	
}

.no-article {
	text-align: center;	
}

#fun-wrap {
	width: 100%;
	height: auto;
	background: url(../fun2013/images/blog-top-tile.jpg);
}
								
#fun-content-wrap {
	width: 990px;
	height: auto;
	margin: auto;	
	background-color: #fff;
	float: left;
}

#fun-header {
	background: url(images/backyard-img.jpg);	
	width: 989px;
	height: 201px;
	margin: auto;
}

#fun-nav {
	width: 925px;
	height: 30px;	
	margin: -15px auto 10px auto;
}

.small-btn {
	background: url(images/small-btn.jpg) repeat-x;	
	height: 30px;
	list-style:none;
	float: left;
	color: #fff;
	padding: 6px 16px;
	text-align:center;
	font-size: 13px; 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-right: 10px;
	cursor: pointer;
}

.small-btn:hover {
	background: url(images/small-btn-hover.jpg) repeat-x;	
	color: #fff;
}

.small-btn a:link {
	text-decoration: non !important;
	color: #fff !important;	
}

.large-btn {
	background: url(images/large-btn.jpg) repeat-x;	
	height: 30px;
	list-style:none;
	float: left;
	color: #fff;
	padding: 10px 24px;
	text-align:center;
	font-size: 16px; 
	font-family: Arial, Helvetica, sans-serif;
	margin-right: 10px;
	font-family: 'marydaleregular';
	cursor: pointer;
}

a.large-btn:hover {
	background: url(images/large-btn-hover.jpg) repeat-x !important;	
	color: #fff !important;
}

a.large-btn {
	color: #fff !important;
	text-decoration: none !important;	
}
.horz-divider {
	width: 100%;
	border-bottom: 1px solid #e4e4e4;
	height: 1px;
}

/*Featured Article*/

#featured-article {
	float: left;	
	height: auto;
	width: 595px;
	margin-top: 20px;
}


.blog-text img {
	display:block; 
	margin: 20px auto;
	border: 4px solid #fff;
	-webkit-box-shadow: 0px 0px 2px 2px #d3d3d3;
	-moz-box-shadow: 0px 0px 2px 2px #d3d3d3;
	box-shadow: 0px 0px 2px 2px #d3d3d3;
}

.article-title a {
	font-weight: bold;
	font-size: 26px;
	color: #7c7c7c !important;
}

.article-title a {
	color: #000;
}

.article-title a:hover {
	color: #0581F4 !important;	
}

.article-text {
	font: normal 18px/28px 'Open Sans', Arial, sans-serif;	
	color: #7c7c7c !important;
}

.article-post-date {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align:left;
	float:left;
	margin-top: 10px;
	margin-bottom: 20px;	
}

/*End*/

/*Pet of the Day*/

#pet-of-the-day {
	float: left;
	width: 334px;
	height: auto;
	border-left: 1px solid #e4e4e4;
	padding-left: 20px;
	margin-top: 20px;
}

.pod-img {
	border: 2px solid #fff;
	height: 200px;
	width: 322px;
	float:left;
	-webkit-box-shadow: 0px 0px 2px 2px #d3d3d3;
	-moz-box-shadow: 0px 0px 2px 2px #d3d3d3;
	box-shadow: 0px 0px 2px 2px #d3d3d3; 	
}

.pod-name {
	margin: 15px 0;
	float: left;
	font-size: 25px;
	font-family: 'marydaleregular';
}

.pod-text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;	
	text-align:left;
	float:left;
	margin-bottom: 10px;
}

#pod-badge {
	background: url(images/pod-badge.png);
	height: 109px;
	width: 90px; 	
	float: right;
	margin-left: 260px;
	position:absolute;
}

/*End*/

/*Customer Photos*/

#fun-customer-photos {
	width: 960px;
	height: 200px;
	margin: 15px 0 15px 20px;
	float:left;
}

	
/*End*/

/*Recent Articles*/

#recent-articles {
	width: 735px;
	margin-left: 20px;
	height: auto;	
	float: left;
}

.article-box {
	height: 400px;
	width: 230px;
	margin-right: 15px;
	-webkit-box-shadow: 0px 0px 2px 2px #d3d3d3;
	-moz-box-shadow: 0px 0px 2px 2px #d3d3d3;
	box-shadow: 0px 0px 2px 2px #d3d3d3; 	
	float: left;
	margin-bottom: 40px;
}


#article-text-cutoff {
	font: normal 18px/28px 'Open Sans', Arial, sans-serif;	
	color: #7c7c7c !important;
}

/*End*/

/*Social Area*/

#social-area {
	width: 205px;
	height: 200px;
	float: left;
}

/*End*/

/* Blog Detail */

#posted-by {
	height: 20px;
	margin: 20px 0 0 20px;
	width: 670px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;	
}

#blog-wrap {
	width: 735px;
	padding: 10px;
	text-align: center;
	float: left;
	border-right: 1px solid #D8D8D8;
	margin-right: 10px;
}

#blog-content {
	width: 740px;
	margin: auto;
}	

#blog-title-wrap {
	width: 600px;
	height: auto;
	margin: auto;	
}

.blog-title {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: bold;
	text-align: left;
	width: 520px;
	margin: 0 auto 30px auto;
	line-height: normal;
}

.comment-count {
	background: url(images/comment-count.jpg) no-repeat;
	height: 35px;
	width:44px;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 8px 0 0 1px;
	margin-left: 20px;
}
								
.blog-feature-img {
	width: 500px;
	border: 5px solid #fff; 									
	-webkit-box-shadow: 0px 0px 2px 2px #d3d3d3;
	-moz-box-shadow: 0px 0px 2px 2px #d3d3d3;
	box-shadow: 0px 0px 2px 2px #d3d3d3;
}

.blog-text {
	text-align: left;
	width: 650px;
	margin: 40px auto;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height:22px;
}

.blog-social {
	border-top: 1px solid #E4E4E4;	
	border-bottom: 1px solid #E4E4E4;	
	height: 20px;
	width: 650px;
	margin: auto;
	padding: 10px 0;
	text-align:left;								
}

.blog-tags {
	width: 650px;
	margin: auto;
	text-align: left;
	padding-top: 20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#comment-wrap {
	width: 740px;
	margin: 40px auto;	
}

.large-user-pic {
	background: url(images/large-user-pic.jpg) no-repeat;
	height: 100px;
	width: 100px;
	float: left;
	clear: both;
}

.comment-box-top {
	background: url(images/comment-box-top.jpg) no-repeat top center;
	height: 70px;
	width: 30px;
	float: left;
	margin-left: 37px;
	position: relative;
	z-index: 10;
}

.comment-box-content {
	background-color: #F6F6F6;
	border: 1px solid #D8D8D8;
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 30px;
	text-align:left;
	line-height:22px;
	margin-bottom: 20px;
	overflow: hidden;
}

.comment-btn {
	height: 15px;
	background: #fff url(images/comment-arrow.png) no-repeat 45px center;
	border: 1px solid #D8D8D8;
	padding: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 60px;
	margin-top: 10px;
	cursor: pointer;
	line-height:normal;
}

.comment-btn-link {
	color: #000 !important;
	text-decoration: none !important;
}
								
.comment-btn:hover {
	background-color:#d9d9d9;
	text-decoration: none !important;
}

.comment-btn2 {
	height: 15px;
	background: #F6F6F6 url(images/comment-arrow.png) no-repeat 45px center;
	padding: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 60px;
	margin-top: 10px;
	cursor: pointer;
	border: 1px solid #D8D8D8;
	line-height: normal;
}

.comment-btn2-link {
	color: #000 !important;
	text-decoration: none !important;
}
								
.comment-btn2:hover {
	background-color:#D8D8D8;
	text-decoration: none !important;
}

#comment-reply {
	background-color: #fff;
	width: 480px;
	height: auto;	
	padding: 20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align:left;
	margin-top: 20px;
	border: 1px solid #D8D8D8;
	line-height:22px;
}

.small-user-pic {
	background: url(images/small-user-pic.jpg) no-repeat;
	height: 50px;
	width: 50px;	
	float: left;
}

.user-info-text {
	height: 50px;
	width: 400px;
	float: left;
	margin: 12px 0 10px 10px;
}

#comment-entry-wrap {
	margin: auto;
	width: 571px;
	text-align:left;
	margin-top: 40px;
	
}

.comment-entry-title {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;	
	margin-bottom: 15px;
}

/*End*/

/* What do you think?*/

#comment-entry {
	height: 70px;
	width: 525px;
	margin-top: 10px;
	resize:none;
	padding:10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 22px;								
}

.expand {
	height: 70px;
	width: 550px;
	padding: 3px;
	resize: none;
	margin-top: 20px;
	padding: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}	

#login-bb {
	width: 550px;
	height: 130px;
	background-color: #F6F6F6;
 	border: 1px solid #D8D8D8;
 	display: none;	
	font-family: Arial, Helvetica, sans-serif;
	padding: 20px;
	
}

.login-left {
	float: left;
	width: 325px;
}

.login-right {
	float: left;
	width: 195px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin-left: 25px;
}

.login-field {
	width: 300px;
	padding-left: 5px;
	height: 25px;
	border: 1px solid #999999;	
	margin-top: 10px;
}

.password-field {
	width: 300px;
	height: 25px;	
	margin-top: 10px;
	padding-left: 5px;
}

.signup-btn {
	height: 15px;
	background: #fff url(images/comment-arrow.png) no-repeat 55px center;
	border: 1px solid #D8D8D8;
	padding: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 60px;
	margin-top: 12px;
	cursor: pointer;
	line-height:normal;
}

.signup-btn-link {
	color: #000 !important;
	text-decoration: none !important;
}
								
.signup-btn:hover {
	background-color:#d9d9d9;
	text-decoration: none !important;
}

#post-comment {
	float: left;
	height: 80px;
	width: 560px;
	margin: 30px 0 0 0;	
}

.notify-me {
	width: 260px;
	margin: -19px 0 0 -24px;	
}

.notify {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;	
}

#logged-in-bb {
	width: 100%;
	height: auto;
	background-color: #F6F6F6;
	font-family: Arial, Helvetica, sans-serif;
	padding: 10px;
	border: 1px solid #F6F6F6;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

.logged-in-text {
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 15px 0 0 15px;
	width: 370px;	
}

.logout-change {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 15px 10px 0 0;	
	float: right;
}
/*end*/
								
/*list page*/
#list-page-left {
	float: left;
	width: 742px;
	height:auto;
	border-right: 1px solid #e4e4e4;
	padding: 0 10px;
}

#list-page-right {
	float: left;
	width: 207px;
	height:auto;
	padding: 20px 0px;	
}

#list-page-search {
	background:url(images/article-search.jpg) no-repeat;
	border: none;
	height: 30px;
	width: 190px;
	margin-bottom: 20px;
	
}


.list-nav-title {
	font-family: 'marydaleregular';
	font-size: 20px;
	font-weight: normal;
	line-height:normal;
}

#list-page-nav {
	padding-left: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
	
#list-page-nav li{
	padding-bottom: 5px;
	cursor: pointer;
}

.list-page-li a {
	color: black;	
	text-decoration: none;
}

.list-page-li a:hover {
	color:#0581F4 !important;	
}

.list-page-li:hover {
	color:#0581F4 !important;	
}

#list-pagination {
	width: 100%;
}

#pagination-ul {
	list-style: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	float: left;
	width: 90%;
	margin-bottom: 40px;
}

#pagination-ul li {
	display: inline;
	border: 1px solid #E4E4E4;	
	padding: 5px 10px;
	margin: 3px;
}

#pagination-ul li a {
	color: #000;
	text-decoration: none;	
}

#pagination-ul li:hover {
	background-color: #E4E4E4;
	color: #000;	
}

.current_page {
	background-color: #0493DD;
	font-weight:bold;
	color: #fff;
}

#pagination-ul .previous a,
#pagination-ul .next a {	
	background-color: #E4E4E4;	
}

/*********************************************************/
/************* DRAWER STYLES *****************************/
/*********************************************************/



.cd-main-content {
  text-align: center;
}
.cd-main-content h1 {
  font-size: 20px;
  font-size: 1.25rem;
  color: #64788c;
  padding: 4em 0;
}
.cd-main-content .cd-btn {
  position: relative;
  display: inline-block;
  padding: 1em 2em;
  background-color: #89ba2c;
  color: #ffffff;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  border-radius: 50em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 5px rgba(0, 0, 0, 0.1);
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.no-touch .cd-main-content .cd-btn:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 20px rgba(0, 0, 0, 0.3);
}
@media only screen and (min-width: 1170px) {
  .cd-main-content h1 {
    font-size: 32px;
    font-size: 2rem;
  }
}

.cd-panel {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  visibility: hidden;
  -webkit-transition: visibility 0s 0.6s;
  -moz-transition: visibility 0s 0.6s;
  transition: visibility 0s 0.6s;
  z-index: 1000;  
}
.cd-panel::after {
  /* overlay layer */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  cursor: pointer;
  -webkit-transition: background 0.3s 0.3s;
  -moz-transition: background 0.3s 0.3s;
  transition: background 0.3s 0.3s;
  content: '';
}
.cd-panel.is-visible {
  visibility: visible;
  -webkit-transition: visibility 0s 0s;
  -moz-transition: visibility 0s 0s;
  transition: visibility 0s 0s;

}
.cd-panel.is-visible::after {
  background: rgba(0, 0, 0, 0.8);
  -webkit-transition: background 0.3s 0s;
  -moz-transition: background 0.3s 0s;
  transition: background 0.3s 0s;
	z-index: 1000;
  content: '';
}
.cd-panel.is-visible .cd-panel-close::before {
  -webkit-animation: cd-close-1 0.6s 0.3s;
  -moz-animation: cd-close-1 0.6s 0.3s;
  animation: cd-close-1 0.6s 0.3s;
  content: '';
}
.cd-panel.is-visible .cd-panel-close::after {
  -webkit-animation: cd-close-2 0.6s 0.3s;
  -moz-animation: cd-close-2 0.6s 0.3s;
  animation: cd-close-2 0.6s 0.3s;
  content: '';
}

@-webkit-keyframes cd-close-1 {
  0%, 50% {
    -webkit-transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(45deg);
  }
}
@-moz-keyframes cd-close-1 {
  0%, 50% {
    -moz-transform: rotate(0);
  }
  100% {
    -moz-transform: rotate(45deg);
  }
}
@keyframes cd-close-1 {
  0%, 50% {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}
@-webkit-keyframes cd-close-2 {
  0%, 50% {
    -webkit-transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-45deg);
  }
}
@-moz-keyframes cd-close-2 {
  0%, 50% {
    -moz-transform: rotate(0);
  }
  100% {
    -moz-transform: rotate(-45deg);
  }
}
@keyframes cd-close-2 {
  0%, 50% {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
}

.cd-panel-container {
  position: fixed;
  width: 100%;
  height: 475px;
  bottom: 0;
  background: #fff;
  z-index: 1;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
  transition-delay: 0.3s;
  z-index: 2000;
}
.from-right .cd-panel-container {
  right: 0;
  -webkit-transform: translate3d(100%, 0, 0);
  -moz-transform: translate3d(100%, 0, 0);
  -ms-transform: translate3d(100%, 0, 0);
  -o-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
}
.from-left .cd-panel-container {
  left: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
  -moz-transform: translate3d(-100%, 0, 0);
  -ms-transform: translate3d(-100%, 0, 0);
  -o-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

.from-bottom .cd-panel-container {
  bottom: 0;
  -webkit-transform: translate3d(0, 100%, 0);
  -moz-transform: translate3d(0, 100%, 0);
  -ms-transform: translate3d(0, 100%, 0);
  -o-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}


.is-visible .cd-panel-container {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  transition-delay: 0s;
}
@media only screen and (min-width: 768px) {
  .cd-panel-container {
    width: 100%;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-panel-container {
    width: 100%;
  }
}

.cd-panel-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* smooth scrolling on touch devices */
  -webkit-overflow-scrolling: touch;
}

/*********************************************************/
/************* PET OF THE DAY STYLES *********************/
/*********************************************************/

.potd-img {
	padding: 40px;
}

.potd-text {
	padding: 40px;
}

#dp .flex-container {
  padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
}
				
#dp .flex-item {
	padding: 5px;
	width: 265px;
	height: auto;
	margin-top: 10px;
	background-color: #F9F9F9;
	box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	margin: 0 10px 20px;
	text-align: center;
	padding: 15px;
}

#dp .flex-item img {
	width: 100%;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	padding-bottom: 15px;
	margin-bottom: 5px;
	padding-top: 15px;
	margin-top: 5px;
}



.col-item {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
	border-color: #ddd;
	text-align: center;
	padding: 10px 20px 20px;
}

.photo img {
	width: 100%;
}
.controls
{
    margin-top: 20px;
}
[data-slide="prev"]
{
    margin-right: 10px;
}

.m-remove {
	background-color: #fff !important;
	border: 1px solid #ddd !important;
	color: #000 !important;
}



.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  border-radius: 3px;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 4px;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(/images/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(/images/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(/images/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(../images/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.image-upload-bg {
	background: url(/images/actionshot-background.jpg) no-repeat;
	background-position: right;
	background-size: contain;
}

.cd-top {
  display: inline-block;
  height: 60px;
  width: 60px;
  position: fixed;
  bottom: 80px;
  right: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: #0581F4 url(/images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #0581F4;
  opacity: 1;
}

.c-float {
	width: 100% !important;
}

.category_banner {
	margin-bottom: 15px;
}

							
.list	{
	width: 100%;
	overflow: hidden;
	
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	
	padding: 0;
}

.list__item	{
	border: #E4DFE2 1px solid;
	padding: 10px;
	margin: 0 5px 10px;
	width: 31%;
	float: left;
	border-radius: 3px;
	background-color: #fff;
	
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	
	position: relative;
}

.list__item__inner {
	width: 100%;
	overflow: hidden;
}

.list__item img	{
	width: 100%;
	display: block;
}

.list__item figcaption	{
	padding: 1.25rem; /* 20 */
}


.two { 
	background-color: white;
	overflow:hidden;
	text-align: center;
}

.one { 
	float: none;
	margin-right:0;
	width:auto;
	border:0;
}

.one-list {
  float:left; 
  margin-right:10px;
  width:20%;
}

.pfull {
	width: 100% !important;	
}

.phalf {
	width: 50%;
}
							
@media screen and (max-width:1200px) { 
	.mega-menu > ul > li > a {
		padding: 0 16px !important;
		font-size: 14px !important;
	}

}

@media screen and (max-width:800px) {
.product {
	width: 90%;	
	height: 90%;
	margin: auto;
	float: none;
	margin-bottom: 10px;
}

.featured-category {
	width: 42%;
	margin: 10px;	
}

.tab-padding {
	padding: 20px 10px;	
}

.list__item	{
	width: 48% !important;
}

.one-list {
  width:50% !important;
}

.phalf {
	width: 100% !important;	
}
	
#dp .flex-item {
	width: 46% !important;
}

.brands-col {
	columns: 2 !important;
	-webkit-columns: 2 !important;
	-moz-columns: 2 !important;
	text-decoration: none !important;
}
	

}

@media screen and (max-width: 480px) {
.product {
	width: 90%;	
	height: 90%;
	margin: auto;
	float: none;
	margin-bottom: 10px;
}

.featured-category {
	width: 42%;
	margin: 10px;	
}

.tab-padding {
	padding: 20px 10px;	
}

.list__item	{
	width: 100% !important;
}

.one-list {
  width:50% !important;
}

.phalf {
	width: 100% !important;	
}
	
#dp .flex-item {
	width: 100% !important;
}
	
.brands-col {
	columns: 2 !important;
	-webkit-columns: 2 !important;
	-moz-columns: 2 !important;
	text-decoration: none !important;
}


}