@charset "utf-8";

/*
Theme Name: Gather Around BBQ - Version 2.0
Author: Jackson Sky
Author URI: http://jacksonsky.com/
Description: A custom theme built for Gather Around BBQ.
Version: 2.0

*/


/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.6;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px dashed #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
	max-width: 100%;
	height: auto;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/***** DEFAULT STYLES *******/
* {
margin: 0;
}
html, body {
height: 100%;
/*background: url(images/common/seamless_paper_texture.png) repeat #e0ded5;*/
}

body{
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-size:16px;
	color:#1e1e1e;
	font-weight:600;
	line-height:1.8;
	}
	
a{color:#bd3730; text-decoration:underline;}
a:hover{color:#9b221b;}
	
p{margin:0 0 25px; letter-spacing:.05em;}

h1, h2, h3, h4, h5, h6{ font-family:'Raleway', Helvetica, Arial, sans-serif; font-weight:600; line-height:1.2; margin:0; padding:0; letter-spacing:.075em; color:#1e1e1e; margin-bottom:5px;}
h1{font-size:30px; color:#fff; text-transform:uppercase;}
h2{font-size:30px;  font-weight:800; margin-bottom: .75em; }
h2.red, h3.red{color:#BD3730;}
h3{font-size:24px;  font-weight:700; color:#bd3730;}
h3.nomargin{margin-bottom:0;}
h4{ font-size:14px; font-weight:700; color:#BD3730;}
h5{ font-size: 14px;}
h6{ font-size:12px; margin-bottom:0;}

.transThree{-o-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;}

.transFour{-o-transition: all .4s linear;
  -moz-transition: all .4s linear;
  -webkit-transition: all .4s linear;
  transition: all .4s linear;}
  
/** Button **/

.btn{background:#d2232a; border:0 none; color:#fff; text-transform:uppercase; font-size:11px; margin:0; padding:5px 10px; font-family:'Raleway', Helvetica, Arial, sans-serif; font-weight:600;
-o-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -webkit-transition: all .3s linear;
  transition: all .3s linear; }
.btn:hover{ cursor:pointer;  background:#a51319;}

a.button{display: inline-block; text-align: center; background-color:#d2232a; box-sizing: border-box; font-family: 'Poppins', sans-serif; font-weight: 900; color: #fff; text-decoration: none; font-size: 30px; text-transform: uppercase; letter-spacing: .02em; padding: .25em .5em; margin: 0 .5em .5em 0;
-o-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -webkit-transition: all .2s linear;
  transition: all .2s linear;}
a.button:hover{background: #9B221B;}


/**** Clearfix update ****/
.group:after {
	visibility: hidden;
	display: block;
	content: "";
	clear: both;
	height: 0;
	}
* html .group             { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */
  
 /*********** LAYOUT ************/
 .wrapper {
	min-height: 100%;
	margin: 0 auto -155px; /* the bottom margin is the negative value of the footer's height */
}
.full{width:100%; display:block;}

.leftSpaceCol{width:50%; height:50px; display:block; 
    float:left;
    margin-right:-550px;}
.rightSpaceCol{width:50%; height:50px; display:block; 
    float:right;
    margin-left:-550px;}
.centerCon{width:1100px; height: 100%; margin: 0 auto;
    position:relative;
    z-index:3;}
/***** main Header *****/
#mainHeader{  width: 100%; height: 260px; position: relative; overflow: hidden;
  background-image: url(images/inside/topBanners/banner1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
/*
  background-size: 100% 100%; //stretch resize
*/
}
#mainHeader .centerCon{width:1100px; height: 100%;
    float:none;
    position:relative;
    z-index:3;}

/** Logo **/
#logo hgroup{display:block; width:365px; height:153px; background: url(images/common/logo.png) top left no-repeat; overflow:hidden; text-indent:-9999em; margin:28px 0 0; float:left; font-size:10px; line-height:0;}


/**** Social Icons ****/
#mainSocialCon{width:674px; float:right; display:block; text-align:right; font-size:20px; line-height:1; margin-top:43px; font-weight:400;}
#mainSocialCon a{ text-decoration:none; color:#000; margin-left:10px; text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.5);}
#mainSocialCon a:hover{ color:#bd3730;}

/** Main Navigation **/
#menu {display: none;}
#mainNavCon{ margin-top:14px; height:50px; display:block; width:685px; float:right;}
#mainHeader .rightSpaceCol{ }
#mainHeader .rightSpaceCol .rightBack{ background:url(images/common/navRibbonLeft.png) no-repeat; background-position:550px 0; height:50px; display:block; width:100%; margin-top:79px;}
#mainNav{ display:block;}
#mainNavEnd{width:5%; display:block; background:url(images/common/navRibbonEnd.png) no-repeat left; height:50px; float:left;}
#mainNav ul{ height:50px; float:left; display:block; margin:0; padding:0; width:95%; list-style:none;}
#mainNav ul li{margin:0; padding:0;}
#mainNav ul li a{text-transform:uppercase; letter-spacing:.05em; color:#fff; line-height:50px; font-size:14px; text-decoration:none; display:inline-block; float:left; padding:0 14px;
-o-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;}
#mainNav ul li a:hover{ background:#d2232a;}
#mainNav{position: relative}
#mainNav ul{position: relative;}
#mainNav ul:before{
 content: '';
  position: absolute;
  height: 100%;
  width: 100vw;
  top: 0;
  background:url(images/common/ribbonbckgrd-black.png);
	z-index: -1;
}


/***** Page Content *****/
#pageContentCon{ width:100%; display:block;}
.redRibbon{background:url(images/common/ribbonRed.png) repeat-x;}

/**** Title Ribbon ****/
#title-ribbon{background:url(images/common/ribbonRed.png) #b6332b;}
#title-ribbon h1{font-size: 48px; font-family: 'Poppins', sans-serif; font-weight: 900; padding: .2em 0 .2em 1em; margin: 0; background:url(images/common/littlepig3.png) no-repeat; background-position:0 .4em; background-size: 36px 37px;}

/***** Content Area *****/
#contentArea{padding: 42px 0;}

/**** Main Content ****/
#mainContent{float:left; width:65%; margin: 0 5% 0 0; padding-bottom:25px;}

#mainContent h1{ background:url(images/common/littlePig.png) no-repeat; background-position:0 10px; line-height:50px; padding:0 0 0 38px; margin-bottom:25px;}
#mainContent h2{}

/**** Side Column ****/
#sideCol{float:left; width:30%; margin: 0 0 0 0; display:block; font-size: 14px;}
#sideCol .sideRibbonHead{ background:url(images/common/ribbonRedTail.png) no-repeat right top; height:50px; width:100%;}
#sideCol .sideRibbonHead h2{background:url(images/common/littlePig.png) no-repeat; background-position:0 10px; line-height:50px; padding:0 0 0 38px; margin-bottom:25px; font-size:24px; color:#fff; text-transform:uppercase; font-weight:600;}

/*** Side Contact ***/
#side-contact{border: 4px solid #000; padding: 5%; box-sizing: border-box; line-height: 1.5; }
#side-contact a{text-decoration: none;}
#side-contact a:hover{text-decoration: underline;}
#side-contact h3{text-indent:-9999em; background:url("images/common/contact.png") no-repeat; background-size: contain; width: 250px; height: 50px; display: block; margin: -1.5em auto 0;}
#side-contact .phone, #side-contact .email{margin: 0 0 1.3em 0;}
#side-contact .location, #side-contact .order{margin: 0 0 2em 0;}
#side-contact .phone, #side-contact .email, #side-contact .location-title h4, #side-contact .hours-title h4 {font-size: 18px; font-weight: 800; color: #1e1e1e;}
#side-contact .email{word-break: break-all;}
#side-contact .location-title h4, #side-contact .hours-title h4{text-transform: uppercase; letter-spacing: .0075em;}
#side-contact a.order-button{display: block; width: 100%; max-width: 300px; text-align: center; background-color:#d2232a; box-sizing: border-box; font-family: 'Poppins', sans-serif; font-weight: 900; color: #fff; text-decoration: none; font-size: 30px; text-transform: uppercase; letter-spacing: .02em; padding: .25em 0;
-o-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -webkit-transition: all .2s linear;
  transition: all .2s linear;}
#side-contact a.order-button:hover{background: #9B221B;}

/** Side Calendar **/
#sideCalendar {padding:0 0 24px 0}
#sideCalendar ul{list-style:none; margin:24px 0 0; padding:0}
#sideCalendar li{ margin:0 0 10px; padding:0; font-family:'Raleway', Helvetica, Arial, sans-serif;}
#sideCalendar li .date{ font-size:18px; font-weight:800; line-height:1.3; text-transform:uppercase;}
#sideCalendar li .calDesc { font-size:14px;  font-weight:600; line-height:1.3;}
#sideCalendar .more a{font-family:'Raleway', Helvetica, Arial, sans-serif; font-weight:800; font-size:14px; }

/** Side Contact Info **/
#sideContact {padding:0 0 24px 0}
#sideContact .contactMargin {margin:24px 0 0; padding:0}
 
 /***** footer ******/
footer#mainFooter, .push {
	height: 155px; /* '.push' must be the same height as 'footer' */
	clear:both;
}

#mainFooter{ background:url(images/common/footerBckgrd.png) repeat;}
#mainFooter .footCon{margin:0 auto; padding:25px 0 40px; display:block; width:1100px; color:#ecebe6;}
#mainFooter .footCol{width:330px; float:left; margin-right:55px;}
#mainFooter .last{margin-right:0;}

/** Email Subscribe **/
#emailSub{text-transform:uppercase;}
#emailSub form input[type=email]{margin-right:13px; height:22px; line-height:22px; width:198px; border:1px solid #b6b5b5; padding:0 5px;}
#mainFooter .mc4wp-form input[type="email"]{display: inline-block; line-height:24px; height:24px; min-height: inherit;}
#mainFooter .mc4wp-form{margin:0;}
#mainFooter .mc4wp-form label{font-weight:600; margin-bottom:6px; color:#ecebe6;}
/** Phone **/
#phoneNumberCon .phoneTitle{width:327px; height:33px; background: url(images/common/footEmerg.png) no-repeat top left; text-indent:-9999em; overflow:hidden; display:block;}
#phoneNumberCon .phoneNumber{width:294px; height:19px; background:url(images/common/footCallUs.png) no-repeat top left; text-indent:-9999em; overflow:hidden; margin-top:5px; display:block;}

/** footerInfo **/
#footerInfo{color:#b6b5b5; font-size:11px; padding-top:15px;}
#footerInfo #copyRight{float:left; display:inline-block; margin-left:24px;}
#footerInfo #footSocialCon{float:left; display:inline-block; margin-left:18px; font-size:20px; line-height:1; font-weight:400;}
#footerInfo #footSocialCon a{color:#fff; text-decoration:none; margin-right:10px;}
#footerInfo #footSocialCon a:hover{ color:#bd3730;}

/*********************** PAGES ********************************/
/***** HOME *****/
.page-template-template-homepage-php #mainHeader{ height:484px; background-size: cover; background-repeat: no-repeat;  min-height: 600px;}
.page-template-template-homepage-php #tagLine {z-index:3; position: absolute; top:25%; width: 100%;}
.page-template-template-homepage-php #tagLine h2{ background:url(images/home/tagLine2.png) no-repeat; width:839px; height: 324px; text-indent:-9999em; font-size:10px; padding:0;  margin: auto; background-size:100%;}
#headerButton{ width: 100%; position: absolute; top: 70%; text-align: center; z-index: 4;}
#headerButton a.button{ background-color:#b7332b;  margin: auto; font-size: 30px; text-transform: uppercase; color: #fff; padding: .5em .75em; text-decoration: none; border: 4px solid #fff;
-o-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -webkit-transition: all .2s linear;
  transition: all .2s linear;}
#headerButton a.button:hover{background: #9B221B;}

/**** Home Announcement Area ****/
.wrapper-con{width: 1100px; margin: 0 auto;}
.wrapper-con-narrow{width: 800px; margin: 0 auto;}
#announcement{background:#161616; color:#fff; font-size: 18px; padding: 45px 0 30px;}
.announcement-title{float:left; width: 35%;}
.announcement-title h3{ background:url(images/home/news.png) no-repeat; width:308px; height:60px; text-indent:-9999em; font-size:10px; padding:0; background-size:100%;}
.announcement-content{float:left; width: 65%; letter-spacing: .075em; line-height: 1.4;}
.announcement-content a{color: #fff;}
.announcement-content a:hover{color:#B7332B;}

/**** Home Content Area *****/
.page-template-template-homepage-php #pageContentCon{margin-top: 0;}
.page-template-template-homepage-php #contentArea{padding: 90px 0;}
.page-template-template-homepage-php #mainContent{width:100%;}
.page-template-template-homepage-php .homeCol{ }
.page-template-template-homepage-php .last, .home .homeCol.last{margin-right:0;}
.page-template-template-homepage-php .more{font-weight:800; font-size:14px; text-transform:uppercase;}

/*** home About ***/
.page-template-template-homepage-php #homeAbout{font-size:12px; font-size: 18px; line-height: 1.6;}
#homeAbout h2{font-size: 72px; font-family: 'Poppins', sans-serif; font-weight: 900; color: #222; text-transform: uppercase; width: 100%; display: block; text-align: center; margin-bottom: .25em; line-height: 1.3;}
#homeAbout h4, .tagline{font-size:30px; font-family: 'Poppins', sans-serif; font-weight: 900; color: #222; width: 100%; text-align: center; margin-bottom: 1.5em; padding-top:.25em; }
.tagline{text-align: left; font-size: 24px;}
#homeAbout h4 a, .tagline a{color:#d2232a; text-decoration: none;}
#homeAbout h4 a:hover, .tagline a:hover{color:#9b221b; text-decoration:underline;}
#homeAbout a.button{color:#d2232a; margin-left: auto; margin-right: auto; display: inline-block; background: #fff; border: #d2232a 2px solid; padding: .35em 1em; text-decoration: none; text-transform: uppercase; letter-spacing: .075em;-o-transition: all .1s linear;
  -moz-transition: all .1s linear;
  -webkit-transition: all .1s linear;
  transition: all .1s linear;}
#homeAbout a.button:hover{color:#fff; background:#9b221b; border: #9b221b 2px solid;}

/*** home Calendar ***/
#homeCalendar ul {list-style:none; margin:24px 0 20px; padding:0}
#homeCalendar li {margin:0 0 10px; padding:0; font-family:'Raleway', Helvetica, Arial, sans-serif;}
#homeCalendar li .date {font-size:18px; font-weight:800; line-height:1.3; text-transform:uppercase;}
#homeCalendar li .calDesc {font-size:14px;  font-weight:600; line-height:1.3;}


/*** Ordering ***/
.orderItems{ line-height:1.6;}
.orderItems h2{margin-bottom:0;}
.orderItems input[type="image"]{margin-top:5px; margin-bottom:5px;}
#product {clear:both;}
#product h3 {color:#BD3730;}
#product img {padding:5px; background:#ffffff; border:1px solid #ccc; margin-top:0;}
#product p {margin:0 0 10px 0}
#product form, #product table {margin:0; padding:0;}

/*** Contact ****/
form#gform_1 input[type=submit]{ font-family: 'Poppins', sans-serif; font-weight: 800; background:#D2232A; color:#fff; text-transform:uppercase; padding:6px 15px 5px; border:0 none; font-size:24px; letter-spacing: .07em;
-o-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;}
form#gform_1 input[type=submit]:hover{ background:#a51319; cursor:pointer;}



/********************* WordPress Styles *********************/

img.alignleft {float:left; display:inline; margin:5px 15px 15px 0;}
img.alignright {float:right; display:inline; margin:5px 0 15px 15px;}
img.alignnone {margin: 0 0 10px 0}
img.aligncenter {clear: both; display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px;}

.alignright {float: right; margin: 0 0 5px 15px; display:inline;}
.alignleft {float: left; margin: 0 15px 5px 0; display:inline;}

#paging {
display: block;
text-align: center;
margin-top: 10px;
margin-bottom: 60px;
font-weight:normal;
font-size:18px;
}

/****************** Event Plugin *********************/
.event_venue {color:#777;}

/****************** Instagram Plugin *********************/
#null-instagram-feed-2 img {width:80px !important;}
#null-instagram-feed-3 img {width:135px !important; border:1px solid #fff; padding:2px; margin:0 10px 10px 0;}

/****************** Misc *********************/
.font14{font-size:14px;}



/* ========================================================================== 
MEDIA SIZES 
========================================================================== */
@media only screen and (max-width: 479px) {
	h2{font-size: 24px;}
	h3{font-size: 21px;}
	#homeAbout h4, .tagline{font-size: 20px;}
	.leftSpaceCol{display:none;}
.rightSpaceCol{display:none;}
	#mainHeader .centerCon{width: 100%;}
.centerCon{width:100%; box-sizing: border-box; padding-left: 3%; padding-right: 3%; 
    float:none;
    position:relative;
    z-index:3;
}
	
/***** main Header *****/
#mainHeader{  width: 100%; height: 52px; padding-bottom:22%; background-position:0 52px;  min-height: inherit;
  background-image: url(images/inside/topBanners/banner1.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
/*
  background-size: 100% 100%; //stretch resize
*/
}
#mainHeader .centerCon{background:#000; min-height:52px;}
#mainSocialCon{ display:none;}


/** Logo **/
#logo hgroup{display:block; width:203px; height:45px; background: url(images/common/logoSmallRed.png) top left no-repeat; overflow:hidden; text-indent:-9999em; margin:3px 0 0 80px; padding:0 0 4px; float:left; font-size:10px; line-height:0; background-size:203px 45px;}
	
/** Main Navigation **/
#menu {
	top:0;
	position: absolute;
	z-index:1;
		width:50px;
display: block;
color:#fff;
background: #d2232a;
font-size:24px;
text-align: center;
padding:0 10px;
border-right:1px solid #661602;
line-height:52px;
text-transform:uppercase;
font-weight:700;
cursor:pointer;
height:52px;
font-weight:bold;
}

#mainNavCon{margin-top:10px; float:none; width:100%; height:auto;}


#mainNavEnd{display:none;}
#mainNavCon.js {
display: none;
border-top:1px solid #661602;
clear:left;
}
#mainNavCon.js.openNav{display:block;}
#mainNav ul{width:100%; height:auto;}
#mainNav ul li{display:block; float:none; position:inherit;}
#mainNav ul li a{display:block; border-bottom: 1px solid #222; float:none; font-size:12px; line-height:inherit;width:96%; padding: 6px 2%; margin:0;}
#mainNav ul ul { display:block; position: inherit; top:0; float:none; width:100%; z-index:inherit;}
#mainNav ul ul li a {}

	
	#title-ribbon h1{font-size: 28px; background-position: 0 .1em; padding-left: 1.5em;}	
/******* Page Content *********/
#pageContentCon{margin-top:0;}
#contentArea{width:100%; padding:0;}

/**** Main Content ****/
#mainContent{float:none; width:90%; margin: 0 auto; padding: 15px 2% 20px;}

/**** Side Column ****/
#sideCol{float:none; width:90%; margin: 0 auto; padding: 0 0 25px; }
	#sideCol #side-contact h3{margin: 0;}	

#sideCol .sideRibbonHead{ background: url(images/common/footerBckgrd.png) repeat right top; height:30px; width:96%; padding:0 2%;}
#sideCol .sideRibbonHead h2{background:url(images/common/littlePig.png) no-repeat; background-position:0 3px; background-size:23px 24px; line-height:30px; padding:0 0 0 32px; margin-bottom:25px; font-size:18px; color:#fff; text-transform:uppercase; font-weight:600;}
#sideCalendar ul{list-style:none; margin:16px 0 0; padding:0 2%; width:96%;}
#sideCalendar .more a{ margin-left:2%;}

/******* Footer *********/
footer#mainFooter{height:auto;}

#mainFooter .footCon{margin:0; padding:25px 10% 40px; display:block; width:80%; color:#ecebe6;}
#mainFooter .footCol{width:100%; float:none; margin-left:auto; margin-right:auto; margin-bottom:20px;}
#mainFooter .last{margin-right:auto;}
#emailSub form [type="text"]{margin-bottom:7px;}

/** Phone **/
#phoneNumberCon .phoneTitle{width:100%; max-width:327px height:1px; padding-bottom:1%; background: url(images/common/footEmerg.png) no-repeat top left; background-size:100%; text-indent:-9999em; overflow:hidden; display:block;}
#phoneNumberCon .phoneNumber{width:100%; max-width:294px; height:1px; padding-bottom:7%; background:url(images/common/footCallUs.png) no-repeat top left; background-size:100%; text-indent:-9999em; overflow:hidden; margin-top:5px; display:block;}

#footerInfo #copyRight{margin-bottom:5px; margin-left:0;}

/******************** PAGES ***************************/
/************ Home ************/
.page-template-template-homepage-php #homeAbout{font-size: 16px;}
.page-template-template-homepage-php #mainHeader{ height:auto !important; background-image:url(images/home/banner/banner1.jpg); padding-bottom:35%;  min-height: inherit;}
.page-template-template-homepage-php #tagLine { display:none;}
.page-template-template-homepage-php #tagLine h2{ background:url(images/home/tagLine.png) no-repeat; width:440px; height:30px; overflow:hidden; text-indent:-9999em; font-size:10px; padding:0; margin:0; background-size:100%;}
#headerButton{display:none;}
	
/**** Home Announcement ****/
#announcement{padding: 20px 0 0px; font-size:14px;}
.wrapper-con{width:90%; padding: 0 5%;}
.announcement-title {width: 70%; padding:0 30% 0 0; float: none;}
.announcement-title h3{width: 100%;}
.announcement-content{width:100%; padding: 0 0 10px; float: none;}
/**** Home Content Area *****/
.page-template-template-homepage-php #contentArea{padding: 35px 0 30px;}
.page-template-template-homepage-php .homeCol{ margin:0% 5%;}
#homeAbout h2 {font-size: 48px; text-align: left;}
.page-template-template-homepage-php #mainContent{width:100%; padding:0; background:none;}
.page-template-template-homepage-php .homeCol{ width:90%; }
.page-template-template-homepage-php #homeGallery, .page-template-template-homepage-php #homeCalendar{background: url(images/common/ribbonSmallBlack.png) repeat-x top; overflow:hidden;padding-bottom:15px;}
.page-template-template-homepage-php #homeGallery h1, .page-template-template-homepage-php #homeCalendar h1{background:url(images/common/littlePig.png) no-repeat; background-position:0 3px; background-size:23px 24px; line-height:30px; padding:0 0 0 32px; margin-bottom:25px; font-size:18px; color:#fff; text-transform:uppercase; font-weight:600;}

/******* Ordering **************/
#product{margin-bottom:15px; border-bottom:1px dashed #ccc;}
#product img.alignleft{margin-left:0; margin-right:0; padding:1.5%; width:97%; height:auto; float:none; display:block;}
	
/**** MISC *****/
	a.button{font-size: 21px;}

}


@media only screen and (min-width: 480px) and (max-width: 767px){
		.leftSpaceCol{display:none;}
.rightSpaceCol{display:none;}
	#mainHeader .centerCon{width:100%;}
.centerCon{width:100%; box-sizing: border-box; padding-left: 3%; padding-right: 3%;
    float:none;
    position:relative;
    z-index:3;
}
	
/***** main Header *****/
#mainHeader{  width: 100%; height: 52px !important; padding-bottom:22%; background-position:0 52px;
  background-image: url(images/inside/topBanners/banner1.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
/*
  background-size: 100% 100%; //stretch resize
*/
}
#mainHeader .centerCon{background:#000; min-height:52px;}
#mainSocialCon{width: 130px; margin-top:16px; margin-right:10px;}
#mainSocialCon a{ text-decoration:none; color:#F0EEE9; text-shadow: none;}
#mainSocialCon a:hover{ color:#bd3730;}

/** Logo **/
#logo hgroup{display:block; width:203px; height:45px; background: url(images/common/logoSmallRed.png) top left no-repeat; overflow:hidden; text-indent:-9999em; margin:3px 0 0 80px; padding:0 0 4px; float:left; font-size:10px; line-height:0; background-size:203px 45px;}
	
/** Main Navigation **/
#menu {
	top:0;
	position: absolute;
	z-index:1;
		width:50px;
display: block;
color:#fff;
background: #d2232a;
font-size:24px;
text-align: center;
padding:0 10px;
border-right:1px solid #661602;
line-height:52px;
text-transform:uppercase;
font-weight:700;
cursor:pointer;
height:52px;
font-weight:bold;
}

#mainNavCon{margin-top:10px; float:none; width:100%; height:auto;}

#mainNavEnd{display:none;}
#mainNavCon.js {
display: none;
border-top:1px solid #661602;
clear:left;
}
#mainNavCon.js.openNav{display:block;}
#mainNav ul{width:100%; height:auto;}
#mainNav ul li{display:block; float:none; position:inherit;}
#mainNav ul li a{display:block; border-bottom: 1px solid #222; float:none; font-size:12px; line-height:inherit;width:96%; padding: 6px 2%; margin:0;}
#mainNav ul ul { display:block; position: inherit; top:0; float:none; width:100%; z-index:inherit;}
#mainNav ul ul li a {}
	
	
#headerButton{display:none;}
	
#title-ribbon h1{font-size: 32px; background-position: 0 .2em; padding-left: 1.5em;}

/******* Page Content *********/
#pageContentCon{margin-top:0;}
#contentArea{width:100%;}

/**** Main Content ****/
#mainContent{float:none; width:96%; margin: 0; padding: 0 2% 20px;}

/**** Side Column ****/
#sideCol{float:none; width:96%; margin: 0 auto; padding: 0 0 25px; }
	#sideCol #side-contact h3{margin: 0;}	

#sideCalendar ul{list-style:none; margin:16px 0 0; padding:0 2%; width:96%;}
#sideCalendar .more a{ margin-left:2%;}

/******* Footer *********/
footer#mainFooter{height:auto;}

#mainFooter .footCon{margin:0; padding:25px 10% 40px; display:block; width:80%; color:#ecebe6;}
#mainFooter .footCol{width:330px; float:none; margin-left:auto; margin-right:auto; margin-bottom:20px;}
#mainFooter .last{margin-right:auto;}

/******************** PAGES ***************************/
/************ Home ************/
.page-template-template-homepage-php #mainHeader{ height:auto; background-image:url(images/home/banner/banner1.jpg); padding-bottom:35%;  min-height: inherit;}
.page-template-template-homepage-php #tagLine {z-index:3; position: absolute; top:80px; left: inherit; right: inherit; left:25px;}
.page-template-template-homepage-php #tagLine h2{ background:url(images/home/tagLine.png) no-repeat; width:440px; height:30px; overflow:hidden; text-indent:-9999em; font-size:10px; padding:0; margin:0; background-size:100%;}
/**** Home Announcement ****/
#announcement{padding: 20px 0 0px; font-size:16px;}
.wrapper-con{width:90%; padding: 0 5%;}
.announcement-title {width: 32%; padding-right: 3%;}
.announcement-title h3{width: 100%;}
/**** Home Content Area *****/
.page-template-template-homepage-php #contentArea{padding: 35px 0 30px;}
.page-template-template-homepage-php #mainContent{width:100%; padding:0; background:none;}
.page-template-template-homepage-php .homeCol{ margin:0% 5%;}
#homeAbout h2 {font-size: 52px}
.page-template-template-homepage-php #homeGallery, .home #homeCalendar{padding-bottom:15px;}
.page-template-template-homepage-php #homeCalendar{}
.page-template-template-homepage-php #homeGallery{ margin:0; width:90%; padding:0 5% 15px; background: url(images/common/ribbonSmallBlack.png) repeat-x top; overflow:hidden;}
.page-template-template-homepage-php #homeGallery h1{background:url(images/common/littlePig.png) no-repeat; background-position:0 3px; background-size:23px 24px; line-height:30px; padding:0 0 0 32px; margin-bottom:25px; font-size:18px; color:#fff; text-transform:uppercase; font-weight:600;}
.homePhotoCon a{margin-right:4px; margin-bottom:4px;}
.homePhotoCon a img{width:100%; height:auto;}

/**** MISC *****/
	a.button{font-size: 21px;}
	
}

@media only screen and (min-width: 768px) and (max-width: 977px){
	/******** LAYOUT ****************/
	.leftSpaceCol{width:50%; height:50px; display:block; 
    float:left;
    margin-right:-375px;}
.rightSpaceCol{width:50%; height:50px; display:block; 
    float:right;
    margin-left:-375px;}
	#mainHeader .centerCon{width:750px;}
.centerCon{width:750px;
    
    position:relative;
    z-index:3;}
	
/********* Header *********/

/**** Social Icons ****/
#mainSocialCon{width:50%; margin-top:43px;}

/** Main Navigation **/
#mainNavCon{ margin-top:14px;}
#mainHeader .rightSpaceCol .rightBack{ background-position:375px 0; height:50px; display:block; width:100%; margin-top:195px;}

/**** Main Content ****/
#mainContent{float:left; width:488px; margin: 0; padding-bottom:25px;}
/**** Side Column ****/
#sideCol{float:left; width:33%; margin: 0 0 0 1%; display:block;}
	
/******* Side Bar ********/
	#side-contact h3{width: 180px; margin-top: -1em;}
	#side-contact a.order-button{font-size: 24px;}

/*********** footer ********/
footer#mainFooter {height:auto;}
#mainFooter .footCon{width:750px;}
#mainFooter #emailSub{ width:300px; margin-right:120px;} 
#mainFooter #phoneNumberCon{ width:330px; margin-right:0;}
#mainFooter #footerInfo{width:350px; margin-right:0; margin:15px 0 0 0;  float:right;}



/** email subscribe **/
#emailSub input[type=submit]{margin-top:5px;}

/** Phone Number **/
#mainFooter #phoneNumberCon{width:330px;}

/******************** PAGES ***************************/
/************ Home ************/
.page-template-template-homepage-php #mainHeader{ height:310px !important;  min-height: inherit; background-image:url(images/home/banner/banner1.jpg);}
.page-template-template-homepage-php #mainHeader .rightSpaceCol .rightBack { margin-top:176px;}
.page-template-template-homepage-php #logo hgroup{display:block; width:225px; height:100px; background: url(images/common/logo.png) top left no-repeat;  margin:28px 0 0; background-size:100%;}
.page-template-template-homepage-php #tagLine {z-index:3; position: absolute; top:85px; left: inherit; right:0; width: 400px;}
.page-template-template-homepage-php #tagLine h2{ background:url(images/home/tagLine.png) no-repeat; width:400px; height:23px; overflow:hidden; text-indent:-9999em; font-size:10px; padding:0; margin:0; background-size:100%;}
#headerButton{top:225px;}
#headerButton a.button{font-size: 24px;}

/**** Announcements *****/
#announcement{padding: 20px 0 10px; font-size: 16px;}
.wrapper-con{width: 750px;}
.announcement-title h3{width:240px;}	

/**** Home Content Area *****/
.page-template-template-homepage-php #contentArea{padding: 35px 0 30px;}
.wrapper-con-narrow{width:750px;}
.page-template-template-homepage-php .homeCol{ width:100%;}
.homePhotoCon a{margin-right:0; margin-bottom:0; width:75px;}
.homePhotoCon a img{width:100%; height:auto;}
	#homeAbout h2{font-size: 60px;}
	
/**** MISC *****/
	a.button{font-size: 24px;}

}



@media only screen and (min-width: 978px) and (max-width: 1120px) {
	/******** LAYOUT ****************/
	.leftSpaceCol{width:50%; height:50px; display:block; 
    float:left;
    margin-right:-480px;}
.rightSpaceCol{width:50%; height:50px; display:block; 
    float:right;
    margin-left:-480px;}
	#mainHeader .centerCon{width:960px;}
.centerCon{width:960px;
    position:relative;
    z-index:3;}
	
/********* Header *********/
	#headerButton a.button{ font-size: 26px;}
	
	
/**** Social Icons ****/
#mainSocialCon{width:50%; margin-top:43px;}

/** Main Navigation **/
#mainNavCon{ margin-top:14px; width:827px;}
#mainHeader .rightSpaceCol .rightBack{ background-position:480px 0; height:50px; display:block; width:100%; margin-top:195px;}


/***** Page Content *****/
#contentArea{width:960px;
    position:relative;
    z-index:3;}
	
/*********** footer ********/
#mainFooter .footCon{width:960px;}
#mainFooter .footCol{width:300px; margin-right:10px;}

/** email subscribe **/
#emailSub input[type=submit]{margin-top:5px;}

/** Phone Number **/
#mainFooter #phoneNumberCon{width:330px;}

/******************** PAGES ***************************/
/************ Home ************/
	
.page-template-template-homepage-php #mainHeader{ height:375px !important; min-height: inherit;}
.page-template-template-homepage-php #tagLine {z-index:3; position: absolute; top:130px; left: inherit; right:0; width: 500px;}
.page-template-template-homepage-php #tagLine h2{ background:url(images/home/tagLine.png) no-repeat; width:500px; height:28px; overflow:hidden; text-indent:-9999em; font-size:10px; padding:0; margin:0; background-size:100%;}
	
	.home #headerButton{top:280px;}
/**** Announcement ******/
	.wrapper-con{width: 960px;}
/**** Home Content Area *****/
	.page-template-template-homepage-php #contentArea{padding:70px 0;}
.page-template-template-homepage-php .homeCol{ margin-right:0;}
.homePhotoCon a{margin-right:5px; margin-bottom:5px;}


}