@import url('reset.css');

@font-face{ 
	font-family: 'WebSymbolsRegular';
	src: url('fonts/websymbols-regular-webfont.eot');
	src: url('fonts/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
	     url('fonts/websymbols-regular-webfont.woff') format('woff'),
	     url('fonts/websymbols-regular-webfont.ttf') format('truetype'),
	     url('fonts/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
	}
	
/*---------------GENERAL--------*/	

body{color:#3b9905; font-family: 'Sanchez', serif;}

span.sofia{ font-family: 'Princess Sofia', cursive; font-weight: normal; }

a:hover{text-decoration: none; color: #ffffff;}
a{text-decoration: none; color: #ffffff;}

#header{ height: 80px; width: 1024px; margin: auto;}

#mainNav{ background: url("images/back-pattern-green.png") repeat; -webkit-box-shadow: 0px 2px 3px #666666; -moz-box-shadow: 0px 2px 3px #666666;
box-shadow: 0px 2px 3px #666666;}

.cssmenu{text-align: center; height: 30px;width: 490px;; margin: 5px auto auto;}

#content{ width: 1024px; margin: auto; margin-top: 15px;}

/*---------------SIDEBAR--------*/

.sidebar{height: 345px; width: 280px; float: left; padding: 30px 0 30px 105px;}
.sidebar span.sofia{font-size: 2em;}
.sidebar p{width: 220px;}

#sidebarBuyPages{margin: 0 auto; float: left; width: 254px;; margin-top: 15px; padding-top: 30px;  padding-right: 20px; padding-left: 80px; }
#sidebarBuyPages span.sofia{font-size: 2em;}


#slider{ width: 585px; height: 430px; float: right; margin-right: 45px;}

/*---------------CATEGORIES--------*/


#categories{float:left; margin-top: 30px; margin-left: 30px;}
a.catNav, a.catNav:link, a.catNav:visited, .catNavSel {display:block; width:200px; height:35px; background: url("images/back-pattern-green.png") repeat; margin-top:2px; text-align:center; text-decoration:none; font-family: 'Sanchez', serif; font-size:14px; color:#f2f2f2; line-height:35px; overflow:hidden;
-webkit-box-shadow: 0px 2px 3px #666666; -moz-box-shadow: 0px 2px 3px #666666;
box-shadow: 0px 2px 3px #666666;
}

a.catNav:hover {color:#fff; background:#FCD116;} 
a.catNav:active, .catNavSel {color:#fff; background:#008000;} 

/*---------------BOTTOM BAR AREA--------*/

.bottomBar{clear: both; padding-left: 80px;padding-right: 45px; height: 50px;}
.shareThisButtons{height:50px; float:left;}
.shareButtons{margin-top: 5px;
}
.glyph, .glyphbox div span {
    font-family: 'WebSymbolsRegular';
}

.mobile{height: 50px; float:right;}
.mobile p{ margin-top: 30px; margin-right: 10px; font-style: italic; color: #197b30; float: left;}
span.mobileIcon{width: 16px; padding: 28px 0 0 0; height: 0; display: block; background: url("images/iphone-icon.png") no-repeat; overflow: hidden; float: right; margin-top: 15px;}
.mobile a{ color: #197b30;}

/*---------------COLUMNS AREA--------*/

#cols{background-color: #fff; width: 924px;margin: 0 auto; height: 220px; z-index: 9999; position: relative; -webkit-box-shadow: 0px -1px 3px #666666; -moz-box-shadow: 0px -1px 3px #666666; box-shadow: 0px -1px 3px #666666; border: #fbc227 solid 15px; padding: 15px 35px;  font-size: 22px; text-align: center;

}
#cols a{color: #3b9905;}
#cols img{ -webkit-box-shadow: 0px -1px 3px #666666; -moz-box-shadow: 0px -1px 3px #666666; box-shadow: 0px -1px 3px #666666;}

.col1{  width: 308px; height: 220px; float: left;}
.col2{  width: 308px; height: 220px; float: left; }
.col3{  width: 308px; height: 220px; float: right;}

/*---------------FOOTER--------*/

#footer{background: url("images/back-pattern-green.png") repeat; height: 245px; margin-top: -205px; z-index:500; position: relative; -webkit-box-shadow: 0px -1px 3px #666666; -moz-box-shadow: 0px -1px 3px #666666; box-shadow: 0px -1px 3px #666666; }
.footerBox{width: 1024px; margin: auto; height: 50px;}
.copyright{ text-align: right; width: 573px; float: left;color: #666666; margin-top: 50px; font-size: smaller;}
.credits{ text-align: right; float: right; color:#666666; margin-top: 50px; font-size: smaller;}


.branding{ float:left; width: 625px; margin-top: 12px; margin-right: 5px;}
h1 a{width: 234px; padding: 39px 0 0 0; height: 0; display: block; background: url("images/happy-tamale-logo.png") no-repeat; overflow: hidden; float: right;}

/*---------------ACTION BUTTONS--------*/

.signUpButton{ float:right; color: #3b9905; margin-top: 15px;}
.signUpButton h3{ margin-left: 25px; width: 100px; background-color: #ecb214; padding:5px 5px; text-align: center; border: #ab7f0a solid 1px; font-size: small; font-weight: lighter;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
-webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
/*-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#ecb214, endColorStr=#ab7f0a);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#ecb214, endColorStr=#ab7f0a);
display:inline-block;*/ /* IE is so silly */}
.signUpButton h3:hover, .actionButton h3:focus{ background: #c08d04; border: solid 1px #866202;}
.signUpButton p{font-style: italic; font-size: 12px; text-align: left; margin-top: 5px;}

.buyButtons{float: right; margin-right: 30px; margin-top: 35px;}
.buyButtons h3{padding:8px 35px 7px 10px; background-color: #e62927; margin-top: 10px; font-size: medium; border: #8f201e solid 1px; font-size: small; font-weight: lighter;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
-webkit-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
}
.buyButtons h3:hover, .buyButtons h3:focus{ background: #b22725; border: solid 1px #621514;}


/*---------------NAVIGATION--------*/

a.nav, a.nav:link, a.nav:visited, .navSel {display:block; width:120px; height: 22px; padding-top: 8px; border-right: solid #4b9023 1px; border-left: solid #4b9023 1px; line-height: 15px; overflow: hidden; float: left; color: #ffffff; }
a.nav:hover {color:#fff; background-color: #4b9023;}
a.nav:active, .navSel {color:#fff; background-color: #4b9023;}
.cssmenu span{display: none;} 

.sidebar h2{font-size: 16px;}
.sidebar p{margin-top: 20px; font-size: 14px; line-height: 18px;}

/*<--------------Slider js-------------->*/
#slider{ margin: 0px auto;}

.rslides { 
  margin: 0px auto;
  }
/*<--------------------------GALLERY------------>*/
body.about #gallery{ width: 580px; height: 430px; float: right; margin-right: 45px;}
body.about #gallery h3 {display:none;}

.photo1{  width: 275px;  float: left;  margin-top: 30px;}
.photo2{  width: 275px;  float: right;  margin-top: 30px;} 
.photo3{  width: 275px;  float: left;  margin-top: 24px;}
.photo4{  width: 275px;  float: right; margin-top: 24px;}

#galleryBuyPages{ width: 670px;float: right; background-color:#fafafa; margin-top: 15px; margin-bottom: 10px; padding-bottom: 40px;}
#galleryBuyPages span.sofia {color:red; font-size: 18px; color:#488214;padding-left: 5px;}
.photo {float:left; width:275px; margin-left: 40px; margin-right: 40px; margin-top: 30px; }
.photoLeft {float:left; width:275px; margin-left: 40px; margin-top: 30px;}