
/*************************************************************************************
Site Name : Happy Treats
Site type : Responsive
Author    : Puran Chand
Stylesheet: Main Stylesheet
Date      : Feb 2014

Here's where the magic happens.
************************************************************************************ */

@import url(reset.css);

/* ******************************************************* SideBar Section ********** */
#sideBar{
	background:url(../images/pattern-wood.jpg) repeat;
	height:100%;
	left:0;
	min-width:255px;
	position: fixed; 	
	top:0;
	width:255px;
	z-index:1005;	
	box-shadow: 1px 0px 18px #000;
	-moz-box-shadow: 1px 0px 18px #000;
	-webkit-box-shadow: 1px 0px 18px #000;
	-ms-box-shadow: 1px 0px 18px #000;
	}
#sideBarContatiner{ background:url(../images/pattern-wood.jpg) repeat ;}
#logo{
	margin:33px 0 45px;
	text-align:center;
	}
#logo a{
	display:inline-block;
	padding:0 1em;
	}

#mobileBtns{
	display:none;
	}

/* Navigation Section */
.closeSlide{
	display:none;
	}
#navigation{
	padding: 0 2em;
	}
#navigation li{
	border-bottom:1px dashed #fff;
	padding:18px 0;
	}
#navigation li a{
	color:#fff;
	display:block;
	font-size:17px;
	font-weight: bold;
	text-align:center;
	}
#navigation li a:hover, #navigation li a.active{
	color:#fdc91c;
	}

#bottomAsideSection{
	left:0;
	position:absolute;
	bottom:0;
	width:100%;
	}
	
/* Newsletter */
#newsletter{
	background:rgba(32, 27, 25, 0.85);
	padding:3px 2em 15px;
	}
#newsletter .title{
	border-bottom:1px dashed #c1b1a0;
	color:#fff;
	font-size:24px;
	font-weight:bold;
	padding-bottom:2px;
	}
#newsletter .title span{
	display:block;
	font-size: 16px;
	}
#newsletter form{
	margin-top:1em;
	}
#newsletter form input[type="text"]{
	background:#594943;
	border:none;
	color:#fff;
	height:28px;
	margin-bottom:0.5em;
	padding:0.7em;
	width:100%;
	
	box-shadow:2px 2px 5px rgba(0, 0, 0, 0.57) inset;
	-moz-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.57) inset;
	-webkit-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.57) inset;
	-ms-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.57) inset;
	}
#newsletter form input[type="submit"]{
	border:none;
	background:#594943;
	color:#fff;
	cursor:pointer;
	float:right;
	padding:3px 2em;
	}
#newsletter form input[type="submit"]:hover{
	background:#603813;
	color:#fff;
	}

/* Language */
#language{
	padding:5px 2em;
	}
#language ul li{
	color:#fff;
	float:left;
	}
#language ul li:after{
	content:'|';
	margin:0 0.5em;
	}
#language ul li:last-child:after{
	display:none;
	}
#language ul li a{
	color:#fff;
	}
#language ul li a:hover, #language ul li a.active{
	color:#fdc91c;
	}
	
/* Socail Media Section */
#socialMedia{
	padding:5px 2em;
	}
#socialMedia a{
	float:left;
	margin:0 2px;
	height:18px;
	position:relative;
	width:19px;
	}
#socialMedia a:hover img{
	opacity:0.7;
	}
#socialMedia a span{
	background:#603813;
	bottom:20px;
	color:#fff;
	font-size:10px;
	height:auto;
	left:0;
	opacity:0;
	position:absolute;
	padding: 4px 10px;
	text-align:center;
	width: 80px;
	
	transform: rotate(0deg) scale(0);
	-moz-transform: rotate(0deg) scale(0);
	-webkit-transform: rotate(0deg) scale(0);
	-ms-transform: rotate(0deg) scale(0);
	
	transform-origin: left bottom;
	-moz-transform-origin: left bottom;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-ms-border-radius:3px;
	
	box-shadow: 0px 0px 5px #E2A66E inset;
	-moz-box-shadow: 0px 0px 5px #E2A66E inset;
	-webkit-box-shadow: 0px 0px 5px #E2A66E inset;
	-ms-box-shadow: 0px 0px 5px #E2A66E inset;
	}
#socialMedia a:hover span{
	left:19px;
	opacity:1;
	
	transform: rotate(-90deg)  scale(1);
	-moz-transform: rotate(-90deg)  scale(1);
	-webkit-transform: rotate(-90deg)  scale(1);
	-ms-transform: rotate(-90deg)  scale(1);
	}


	
/* ******************************************************* Main Container Section ********** */
#mainGrid{
	background:url(../images/home-bg.jpg) no-repeat center center;
	margin-left:255px;
	height:100%;
	z-index:1004;
	
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	-ms-background-size:cover;
	}
#homeContent{
	height:100%;
	left:5%;
	position:relative;
	top:0;
	width: 90%;
	}
#homeTitle{
	bottom:0;
	left:0;
	right:0;
	max-width: 683px;
	margin:auto;
	position:absolute;
	top:0;
	width:80%;
	}
#mainGrid.allBack{
	background: url(../images/product-bg.jpg) repeat-y right top;
	background-size: 100% auto #FFF;
	overflow: visible;
	height:auto;
	min-height:100%;
	}
#mainGrid.productBack{
	background: url(../images/product2-bg.jpg) no-repeat 133px 0 fixed ;
	overflow: visible;
	height:auto;
	min-height:100%;  
}
#mainGrid.contactBack{
	background: url(../images/contact-bg.jpg) no-repeat top left;
	overflow: visible;
	height:auto;
	min-height:100%; 
}

#rightSectionGrid{
	position:relative;
	height:100%;
	}
/* Product Section */
.leftSectionContent{
	background-color:#fefaea;
	float:left;
	height:100%;
	min-width: 284px;
	position: absolute;
	width: 284px;
	left: 0;
	top: 0;
	}
.aboutProducts{
	padding:122px 3em;
	}
.aboutProducts h2{
	color:#fdc91c;
	font-size: 30px;
	margin-bottom:2em;
	position:relative;
	}
.aboutProducts h2:after{
	border:solid transparent;
	border-color:rgba(0, 0, 0, 0);
	border-left-color:#fdc91c;
	border-width:8px;
	content:'';
	display:inline-block;
	position: relative;
	top: -3px;
	margin-left: 20px;
	}
.aboutProducts p{
	color:#4d3b2c;
	line-height:1.8;
	}
	
.productsGrid{
	float:right;
	padding:6em 2em 6em;
	padding-left: 314px;
	width: 100%;
	}
.productDetail{
	padding-top:122px;
	}
.productListing{
	padding:0;
	}
.productListing .col1{
	padding:0.5em 0.8em;
	width: 33%;
	}
.productListing .col1.hide{
	display:none;
	}
.productListing .col1 a{
	background:#fff;
	border:1px solid #c7c8c8;
	display:block;
	position: relative;
	overflow:hidden;
	padding-bottom: 1px;
	text-align:center;
	}
.productListing .col1 a img{
	vertical-align:top;
	}
.productListing .col1 .productTitle{
	color:#4d3b2c;
	font-size:1.4em;
	padding:0.4em 0;
	}
	
/* Product Detail Page */
#productDetail h3{
	font-size:24px;
	}
#productDetail figure{
	background:#fff;
	border: 1px solid #ccc;
	float: right;
	margin:0 0 5em 5em;
	}
#productDetail figure img{
	
	}
#productDetail figure span{
	display:block;
	padding:5px 10px;
	text-align:right;
	}
#productDetail h2, .locationContact h2{
	color:#382a1f;
	font-size:3em;
	margin-bottom:1em;
	position:relative;
	}
#productDetail p{
	line-height:1.7;
	}
#productDetail h2 img.nuts{
	left:-70px;
	position:absolute;
	top:0;
	}

.productsIcons{
	margin-top:2.2em;
	}
.productsIcons li{
	float:left;
	margin-bottom:3em;
	margin-right:3em;
	}
.productsIcons li{}
.productsIcons li {
	background:#a97d50;
	background:#784d29;
	color:#fff;
	display:inline-block;
	font-size: 16px;
	font-weight:normal;
	line-height:154px;
	height:154px;
	position:relative;
	text-align:center;
	width:154px;
	
	border-radius:50% 0% 50% 50%;
	-webkit-border-radius:50% 0% 50% 50%;
	-moz-border-radius:50% 0% 50% 50%;
	-ms-border-radius:50% 0% 50% 50%;
	
	box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-webkit-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-moz-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-ms-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	
	}
.productsIcons li a{
	background:#a97d50;
	background:#784d29;
	color:#fff;
	display:inline-block;
	font-size: 16px;
	font-weight:normal;
	line-height:154px;
	height:154px;
	position:relative;
	text-align:center;
	width:154px;
	
	border-radius:50% 0% 50% 50%;
	-webkit-border-radius:50% 0% 50% 50%;
	-moz-border-radius:50% 0% 50% 50%;
	-ms-border-radius:50% 0% 50% 50%;
	
	box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-webkit-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-moz-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-ms-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	
	}
.productsIcons li  span{
	background:#c59a6c;
	border:5px solid #fff;
	display:block;
	height:50px;
	position:absolute;
	right:-15px;
	top:-15px;
	width:50px;
	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-ms-border-radius:50%;
	
	box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-webkit-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-moz-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	-ms-box-shadow:1px 2px 5px rgba(0, 0, 0, 0.71);
	}
.productsIcons li  span img{
	margin-right:-12px;
	}
.productsIcons li a:hover{
	background:#784d29;
	}

/* Location Section */

.location{
	padding: 6em;
	}
.locationbg {
  background: #fff;
  padding: 50px 20px 70px 20px;
  box-shadow: 2px  2px 10px #444444;
  background:url(../images/contactboxBg.jpg) no-repeat right top #fff;  
  background-size:auto 100%;
}
.contact .col2.contbgbox{
	background:url(../images/contactheBox.png) no-repeat left top; background-size:100%;
	padding:55px 5px 40px 45px;
	display:block;
	margin-right: 35px;
}
.contact .col2.contbgbox P{ padding-right:15%; font-family:"Arial Unicode MS"; color:#603813; font-size:18px; line-height:40px; }
.contact .col2.contbgbox h2{  margin-bottom: 15px;}
.locationContact .col1{
	float:left;
	width:33%;
	}
.locationContact h2{
	color:#5f3914;
	}
.locationContact figure{
	margin-bottom:1em;
	}
.locationContact li{
	color: #5f3914;
    font-size: 18px;
    padding: 0.5em 0.5em 0.5em 30px;
    position: relative;
	}
.locationContact li:nth-child(2){
	min-height:125px;
	}
.locationContact li span{
	left:0;
	position:absolute;
	top: 11px;
	}
.locationContact li span img{
	width: 20px;
	}
.productListing .locationContact li a.mapBtn{
	background:#fff;
	display:inline-block;
	margin-top:-3px;
	padding:3px 5px ;
	
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	}

/* Accordian Navigation */
.accordianNav{
	position:relative;
	}
.accordianNav li a{
	font-size: 15px;
	transition:none;
	}
.accordianNav li.hide{
	display:none;
	}
.accordianNav li a:hover{
	color:#fdc91c;
	}
.accordianNav li h4{
	cursor:pointer;
	font-size:24px;
	margin:1.5em 0 0.5em;
	position:relative;
	}
.accordianNav li h4:before{
	border:solid transparent;
	border-color:rgba(0, 0, 0, 0);
	border-left-color:#000;
	border-width:8px;
	content:'';
	position:absolute;
	right:0;
	top:10px;
	}
.accordianNav li h4.active:before{
	border-left-color:transparent;
	border-top-color:#000;
	right: 4px;
	top: 10px;
	}
.accordianNav li h4:hover{
	color:#fdc91c;
	}
.accordianNav li h4:hover:before{
	border-left-color:#fdc91c;
	}
.accordianNav li h4.active:hover:before{
	border-left-color:transparent;
	border-top-color:#fdc91c;
	}
.accordianNav ul li li{
	line-height:1.7;
	list-style:disc;
	margin-left:50px;
	}
.accordianNav ul li ul{
	display:none;
	}

/* Product Pagination */
.productPagination{
	float:right;
	padding-top:1em;
	}
.productPagination a{
	color:#4d3b2c;
	font-size:1.2em;
	}
.productPagination a:hover{
	color:#000;
	}
.productPagination a.active{
	font-weight:bold;
	}
.productPagination a:after{
	content:'|';
	margin-left:0.4em;
	}
.productPagination a:last-child:after{
	display:none;
	}

/* About Us */
.aboutUs {
	color:#603813;
	margin-bottom: 31px;
	}
.aboutUs p{
	color:#603813;
	line-height: 1.7;
	}
.aboutUs figure {
	float: right;
	margin: 0 0 5em 5em;
	}
.aboutUs h3{
	font-size:3.05em;
	position:relative;
	}
/*.aboutUs h3 em{
	left:-10px;
	position:absolute;
	top:-5px;
	}*/

/* Contact Us 8 */
.contact .col2{
	float:left;
	padding:0 5em 0 0;
	width:288px;
	}
.contact .col3{
	float:left;
	width:415px;
	}
.contact .col3 .contactTextBox{
	border:1px solid #603813;
	color:#603813;
	height:44px;
	margin-bottom:5px;
	padding:10px;
	width:100%;
	font-size:17px;
	}
.contact .col3 .contactTextareaBox{
	height:241px;
	}
#captcha {
	position:relative;
	overflow:hidden;
	}
#captcha span{
	color:#603813;
	display:inline-block;
	font-weight:bold;
	margin-bottom:0.3em;
	}
#captcha .captchaPanel input{
	border:1px solid #603813;
	color:#603813;
	float:left;
	height:44px;
	margin-right:10px;
	margin-bottom:0.7em;
	padding:10px;
	width:150px;
	}
#captcha .captchaPanel #refresh{
	
	float:left;
	}
#captcha .captchaPanel #refresh input{
	background:url(../images/captcha.jpg) no-repeat;
	border: none;
	font-weight: bold;
	font-size: 22px;
	color: #000;
	}
#captcha .captchaPanel img{
	width: 133px;
	}

.contactSubmit{
	background:#603813;
	color:#fff;
	cursor:pointer;
	font-weight:bold;
	margin-top:0em;
	padding:1em 2em;
	}
.contactSubmit:hover{
	background:#000;
	}
.error{
	background:#f00;
	border:1px solid #f00;
	}

/* ******************************************************* Footer Section ********** */
#footer{
	background:#603813;
	bottom:0;
	left:0;
	padding: 1em 1em 1em 285px;
	position: fixed;
	width:100%;
	}
#footer > div{
	color:#fff;
	}
	
/* Search Section */
#searchGrid label{
	float:left;
	height:2.1em;
	line-height:2.1em;
	margin-right:0.5em;
	}
#searchGrid form{
	float:left;
	max-width:15em;
	position:relative;
	}
#searchGrid form input[type="text"]{
	color: #454545;
	height:2.1em;
	padding-left:2em;
	width:100%;
	}
#searchGrid form input[type="submit"]{
	background:url(../images/search.png) no-repeat center center;
	cursor:pointer;
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:2em;
	text-indent:-9999px;
	}

/* Copyright Section */
#footer #copyRight{
	font-size: 1em;
	text-align: right;
	line-height: 1.2;
	}
#footer #copyRight span{
	display:block;
	}
#footer #copyRight span a{
	color:#fff;
	}
#footer #copyRight span a:hover{
	color: #df5f32;
	}


/* Overlay Section */
.overlay{
	background:rgba(0, 0, 0, 0.7);
	display:none;
	left:0;
	height:100%;
	position:fixed;
	top:0;
	width:100%;
	z-index:1006;
	}
.show.overlay{
	display:block;
	}

/* Light Box */
.lightBox {
    position: fixed;
	opacity:0;
	visibility:hidden;
	z-index: 1007;
	left:0;
	top:0;
	padding:2em 0;
	height:100%;
	width:100%;
	transition:all 0.3s ease-in-out;
	}
.lightBox.show{
	opacity:1;
	visibility:visible;
	}
.lightBoxInner{
	background:#fff;
	max-width: 700px;
    min-width: 700px;
    opacity: 1;
    padding: 0.5em;
    position: relative;
    text-align: center;
	transition:all 0.7s ease-in-out;
	display:none;
	margin:0 auto;
	}
.show .lightBoxInner{
	display:block;
	}
.lightBoxInner a.close{
	background:#fff;
	color:#f00;
	font-weight:bold;
	height:30px;
	font-size: 18px;
	line-height:30px;
	position:absolute;
	right:0;
	top:0;
	text-align:center;
	width:30px;
	z-index: 1008;
	}
.lightBoxInner a.close:hover{
	color:#000;
	}
.mapGrid{
	display:none;
	}
	
/* ******************************************************* Keyframes Section ********** */
@-webkit-keyframes slideUp{
0%{
	-webkit-transform:translateY(100px);
	}
100%{
	-webkit-transform:translateY(0);
	}
}



#productDetail figure span
{
display:none;
}
#language
{
display:none!important;
}

.lightBox.show{ margin-top:10%;}

body {
   -webkit-overflow-scroll: touch;
   overflow-y: scroll;
}