/*

=====================================================================

*   Woo v1.0 Layout Stylesheet

*   url: styleshout.com

*   05-02-2014

=====================================================================



   TOC:

   a. General and Common Styles

   b. Header Styles

   c. Hero Section

   d. Features Section

   e. Pricing Section

   f. Screenshots Section

   g. Call To Action Section

   h. Testimonials Section

   i. Subscribe Section

   j. Footer

   k. lightbox



   todo: check bug in mobile z-index



===================================================================== */



/* ------------------------------------------------------------------ */

/* a. General and Common Styles

/* ------------------------------------------------------------------ */
body  { /*background: #d6d7d8;*/
	background: #d6d7d8 url(../images/background.jpg);
	background-size: cover;
	background-repeat:no;	
	font-family: 'Open Sans', sans-serif;
	font-size: 18px;
	color: black;

}


.htmlBackground{
	max-width:1600px;
	margin-left:auto;
	margin-right:auto;
	/*font-family: 'Open Sans', sans-serif;*/	
	margin-top: 54px;
}

#rotisserie  h1, #logcakes h1, #goodies h1{
	/*color: #777;*/
	color:black;
	font: 65px 'Pacifico', cursive;
}

.order_btn{
	cursor:pointer;
}

.section-head {

	padding: 0 4%;	

   text-align: left;

   line-height: 20px;

}

.section-head h1 {

   font: 20px/36px 'montserrat-bold', sans-serif;

   color: #333;

   text-transform: uppercase;

   letter-spacing: 1.5px;

   margin-bottom: 12px;

}

.section-head h2 {

   font: 20px/36px 'opensans-bold', sans-serif;

   color: #333;

   text-transform: uppercase;

   letter-spacing: 1.5px;

   margin-bottom: 0px;

}



.section-head  .promo {

	background: #333; padding: 10px; color: #ccc; text-transform: uppercase; font-weight: bold;

	margin: 10px 0;

}

/* for css animations */

.show { opacity: 1; }

.js #mc_embed_signup input[type="email"],

.js #mc_embed_signup input[type="submit"] {

   opacity: 0;

}



ul {

	list-style-type: disc;

}

ul li {

	margin: 0 0 0 15px;

}


.centerli {
  list-style: none;
  text-align: center;
}
.centerli li:before {
  content: "\2022  "
}


/* ------------------------------------------------------------------ */

/* b. Header Styles

/* ------------------------------------------------------------------ */



header {

   height: 54px;

   width: 100%;

   background: #13171B;

   position: fixed;

   left: 0;

   top: 0;

   z-index: 990;

}



/* header logo */

header .logo {

   margin-left: 36px;

   margin-right: 20px;

   margin-top: 13px;

   float: left;

   width: auto; 

   z-index: 991; 



   /* add position relative since z-index only applies to  

   elements that have been given an explicit position */

   position: relative; 

}

header .logo a {

   display: block;

   margin: 0;

	padding: 0;

	border: none;

	outline: none;

   /*

   width: 64px;

   height: 18px;   

   */

}



/* header social */

header .header-social {

	font-size: 20px;

   font-weight: normal;

   line-height: 54px;

   color: #424a56;

   margin: 0 10px 0 0;

   padding: 0;

   float: right;

}

header .header-social li {

   display: inline-block;

   margin-right: 20px;

}

header .header-social li a { color: #fff; }

header .header-social li a:hover { color: #b28c35; }



/* primary navigation

--------------------------------------------------------------------- */

#nav-wrap, #nav-wrap ul, #nav-wrap li, #nav-wrap a {

	 margin: 0;

	 padding: 0;

	 border: none;

	 outline: none;

}



/* nav-wrap */

#nav-wrap {

   font: 15px 'opensans-bold', sans-serif;

   text-transform: uppercase;

   letter-spacing: 1.5px;

   float: left;

}



/* hide toggle button */

#nav-wrap > a { display: none; }



#navi-wrapper-mobile {display: none; }



ul#nav {

   min-height: 54px;

   width: auto;



   /* left align the menu */

   text-align: left;

}

ul#nav li {

   position: relative;

   list-style: none;

   height: 54px;

   display: inline-block;



}



/* Links */

ul#nav li a {



   /* 8px padding top + 8px padding bottom + 38px line-height = 54px */

   display: inline-block;

   padding: 8px 8px;

   line-height: 38px;

	text-decoration: none;

   text-align: left;

   color: #fff;



	-webkit-transition: color .2s ease-in-out;

	-moz-transition: color .2s ease-in-out;

	-o-transition: color .2s ease-in-out;

	-ms-transition: color .2s ease-in-out;

	transition: color .2s ease-in-out;

}

ul#nav li a:hover { color: #58687A; }

ul#nav li a:active { background-color: transparent !important;}

ul#nav li.current a { color: #58687A; }





.floatLeft {

	position: relative;

	float: left;

}



/* ------------------------------------------------------------------ */

/* c. Hero Section

/* ------------------------------------------------------------------ */



#hero {

    /*padding-top: 54px;*/

    

	/* Location of the image */

	/*background: #d6d7d8 url(../images/bg_hero.jpg);*/

	

	/* Background image is centered vertically and horizontally at all times */

	background-position: top center;



	/* Background image doesn't tile */

	background-repeat: no-repeat;



	/* Background image is fixed in the viewport so that it doesn't move when 

	the content's height is greater than the image's height */

	background-attachment: fixed;



	/* This is what makes the background image rescale based

	on the container's size */

	/*background-size: cover;*/

	background-size: cover;

	-webkit-background-size: cover;

        -moz-background-size: cover;

        -o-background-size: cover;

	

	overflow: hidden;

}







#hero .row { max-width: 1040px; }



/* Hero Text */

.hero-text {

	color: #676e73;

   width: 83%;

   text-align: center;

   margin: 54px auto 24px auto;

}

.hero-text h1 {

   font: 40px/1.2em 'montserrat-regular', sans-serif; 

   color: #fff;

   padding: 0;

   margin: 0;

   text-shadow: 0px 1px 4px rgba(0, 0, 0, .2);

}

.hero-text h1 span,

.hero-text a { color: #b28c35; }

.hero-text p {

   font: 16px/30px 'opensans-regular', sans-serif;

   padding: 0;

   margin: 12px 8% 0;

   text-shadow: 0px 1px 2px rgba(0, 0, 0, .2);

}



/* Hero Image */

.hero-image {

   width: 80%;

   margin: 0 auto;

}

.hero-image img {

   vertical-align: bottom;

   display: block;

}



/* Hero CTA Buttons */

#hero .buttons {

   text-align: center;

   margin: 0 0 18px 0;

}

#hero .buttons .button {

   font: 14px/24px 'montserrat-bold', sans-serif;

   text-transform : uppercase;

   letter-spacing: 2px;

}

#hero .buttons .trial {

   background: #f64b39;

   margin-right: 30px;



   -webkit-animation-delay: 10s;

      -moz-animation-delay: 10s;

       -ms-animation-delay: 10s;

        -o-animation-delay: 10s;

   -webkit-animation-iteration-count: 3;

      -moz-animation-iteration-count: 3;  

}

#hero .buttons .trial:hover { background: #F86A5A; }

#hero .buttons .learn-more {}





/* ------------------------------------------------------------------ */

/* d. Features Section

/* ------------------------------------------------------------------ */

#features, #countdown-content, #dining_square-content, #dining_kinta-content, #gathering-content, #staycation-content, #yuletide-content, #takeaway-content{
   background: #fbfafa url('../images/bg_text.jpg') no-repeat bottom center;	
   background-size: 100%;
	-webkit-background-size: cover;
	-moz-background-size: 100%;
	-o-background-size: 100%;
   padding-top: 96px;   
   padding-bottom: 78px;   
   overflow: hidden;
}

#features, #countdown, #dining_square, #dining_kinta, #gathering, #staycation, #yuletide {

   background: #fbfafa;

}

#features .feature {

   margin-top: 30px;

   margin-bottom: 54px;

}

#features .right {

   padding-left: 32px;

   float: right;   

}

#features .left {

   padding-right: 32px;

   float: left;   

}

#features h3 {

   font: 16px/24px 'montserrat-bold', sans-serif;

   text-transform: uppercase;

   letter-spacing: 1px;

   color: #777;

}



/* link Content */

#navi-wrapper .columns { padding: 0; }

.item .item-wrap {

   background: #fff;

   overflow: hidden;

   position: relative;



   -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.item .item-wrap a {

   display: block;

   cursor: pointer;

}



/* overlay */

.item .item-wrap .overlay {

   position: absolute;

   left: 0;

   top: 0;

   width: 105%;

   height: 105%;



	opacity: 0;

	-moz-opacity: 0;

	filter:alpha(opacity=0);



   -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;



   background: url(img/overlay-bg.png) repeat;

}

.item .item-wrap .link-icon {

   display: block;

   color: #fff;

   height: 60px;

   width: 100%;

   font-size: 18px;

   line-height: 30px;

   text-align: center;



   opacity: 0;

	-moz-opacity: 0;

	filter:alpha(opacity=0);



   -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;



   position: absolute;

   top: 45%;

   left: 0;

   margin-left: 0px;

   margin-top: 0px;

}

.item .item-wrap img {

   vertical-align: bottom;



   -webkit-transition: all 0.3s ease-out;

	-moz-transition: all 0.3s ease-out;

	-o-transition: all 0.3s ease-out;

	-ms-transition: all 0.3s ease-out;

	transition: all 0.3s ease-out;

}



/* on hover */

.item:hover .overlay {

	opacity: 1;

	-moz-opacity: 1;

	filter:alpha(opacity=100);

}

.item:hover .link-icon {

   opacity: 1;

	-moz-opacity: 1;

	filter:alpha(opacity=100);

}

.item:hover .item-wrap img {

   -moz-transform: scale(1.2);

	-o-transform: scale(1.2);

	-webkit-transform: scale(1.2);

	transform: scale(1.2);

}



/* ------------------------------------------------------------------ */

/* c. countdown Section

/* ------------------------------------------------------------------ */



#countdown {	

	padding: 0px;

    text-align: center;

	width:100%;
}



#countdown-heading,#dining_square-heading,#gathering-heading  {

	/*background: #efeff1 url(../images/bg_countdown.jpg);*/

	background-position: top center;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	/*overflow: hidden;

	height: 700px;*/
	

	padding: 0px;

}

#countdown-content {
	/*background: #efeff1;
	padding-top: 96px;
	padding-bottom: 78px;
	color: #777;*/
	color:black;
}



#countdown h1{
	/*color: #777;*/
	color:black;
	font: 65px 'Pacifico', cursive;
}

#countdown h2{
	/*color: #777;*/
	color:black;
}

.countdown-copy{
	/*position: relative; top:30%;left: 50%; width: 45%;*/
	position: relative; top:5%;
}

.countdown-copy-mobile{
	display: none;
}



/* ------------------------------------------------------------------ */

/* c. dining_square Section

/* ------------------------------------------------------------------ */



#dining_square {	
	padding: 0px;
    text-align: center;
}


/*#dining_square-heading {
	background: #efeff1 url(../images/bg_yuletide.jpg);
	background-position: top center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;  
	overflow: hidden;
	height: 700px;
	padding: 0px;
}*/

#dining_square-content {
	/*background: #efeff1;*/
	padding-top: 96px;
	padding-bottom: 78px;
	/*color: #777;*/
	color:black;
}


#dining_square h1{
	/*color: #777;*/
	color:black;
	font: 65px 'Pacifico', cursive;
}

#dining_square h2{
	/*color: #777;*/
	color:black;
}

.dining_square-copy{
	/*position: relative; top:30%; left: 50%; width: 40%;*/
	position: relative; top:5%;
}

.dining_square-copy-mobile{
	display: none;
}


/* ------------------------------------------------------------------ */

/* c. dining_kinta Section

/* ------------------------------------------------------------------ */



#dining_kinta {	
	padding: 0px;
    text-align: center;
}



#dining_kinta-heading {
	background: #efeff1 url(../images/bg_kinta.jpg);
	background-position: top center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;   
	overflow: hidden;
	height: 700px;
	padding: 0px;
}

#dining_kinta-content {
	/*background: #efeff1;*/
	padding-top: 96px;
	padding-bottom: 78px;
	/*color: #777;*/
	color:black;
}



#dining_kinta h1{
	/*color: #777;*/
	color:black;

}

#dining_kinta h2{
	/*color: #777;*/
	color:black;

}



.dining_kinta-copy{

	position: relative; top:30%;left: 10%; width: 35%;

}



/* ------------------------------------------------------------------ */

/* c. gathering Section

/* ------------------------------------------------------------------ */



#gathering {	

	padding: 0px;

    text-align: center;

}


/*
#gathering-heading {

	background: #efeff1 url(../images/bg_gathering.jpg);

	background-position: top right;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	overflow: hidden;

	height: 700px;

	padding: 0px;

}*/

#gathering-content {
	/*background: #efeff1;*/   
	padding-top: 96px;
	padding-bottom: 78px;
	/*color: #777;*/
	color:black;
}

#gathering h1{
	/*color: #777;*/
	color:black;
	font: 65px 'Pacifico', cursive;
}

#gathering h2{
	/*color: #777;*/
	color:black;
}


.gathering-copy{
	/*position: relative; top:30%;left: 50%; width: 45%;*/
	position: relative; top:5%;
}

.gathering-copy-mobile{
	display: none;
}



/* ------------------------------------------------------------------ */

/* c. staycation Section

/* ------------------------------------------------------------------ */



#staycation {	

	padding: 0px;

    text-align: center;

}



#staycation-heading {

	background: #efeff1 url(../images/bg_staycation.jpg);

	background-position: top center;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	overflow: hidden;

	height: 700px;

	padding: 0px;

}

#staycation-content {

	/*background: #efeff1;*/

   padding-top: 96px;

   padding-bottom: 78px;

	/*color: #777;*/
	color:black;

}



#staycation h1{
	/*color: #777;*/
	color:black;

}

#staycation h2{

	/*color: #777;*/
	color:black;

}





.staycation-copy{

	position: relative; top:40%;left: 50%; width: 40%;

}





/* ------------------------------------------------------------------ */

/* c. yuletide Section

/* ------------------------------------------------------------------ */



#yuletide {	

	padding: 0px;

    text-align: center;

}



#yuletide-heading {

	background: #efeff1 url(../images/bg_takeaway.jpg);

	background-position: top center;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	overflow: hidden;

	height: 700px;

	padding: 0px;

}

#yuletide-content {

	/*background: #efeff1;*/

   padding-top: 96px;

   padding-bottom: 78px;

	/*color: #777;*/
	color:black;

}



#yuletide h1{
	/*color: #777;*/
	color:black;

}

#yuletide h2{
	/*color: #777;*/
	color:black;

}





.yuletide-copy{

	position: relative; top:60%;left: 50%; width: 40%;

}







/* ------------------------------------------------------------------ */

/* c. takeaway Section

/* ------------------------------------------------------------------ */



#takeaway {	

	padding: 0px;

    text-align: center;

}



#takeaway-heading {

	background: #efeff1 url(../images/bg_takeaway.jpg);

	background-position: top center;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	overflow: hidden;

	height: 700px;

	padding: 0px;

}

#takeaway-content {

	/*background: #efeff1;*/

   padding-top: 96px;

   padding-bottom: 78px;
	/*color: #777;*/
	color:black;

}



#takeaway h1{
	/*color: #777;*/
	color:black;
	font: 65px 'Pacifico', cursive;
}

#takeaway h2{
	/*color: #777;*/
	color:black;

}

#takeaway h3{
	/*color: #777;*/
	color:black;

}





.takeaway-copy{

	position: relative; top:35%;left: 45%; width: 40%;

}

/* ------------------------------------------------------------------ */

/* g. order Section

/* ------------------------------------------------------------------ */

.deli{

	color: #eeeeee;	

}

.table_listing{

	color: #ffffff !important;

}

.orderform td{

	padding: 10px;

	color: #333;

}

.bottom_prices{

	color: #333333;	

	text-align: right;



}

.orderform label {

	color: #777;	

}



/* ------------------------------------------------------------------ */

/* c. Takeaway

/* ------------------------------------------------------------------ */



#thankyou {	

	padding: 0px;

    text-align: center;

}



#thankyou-heading {

	background: #d2d2d2 url(../images/bg_takeaway.jpg);

	background-position: top center;

	background-repeat: no-repeat;

	background-attachment: fixed;

	background-size: cover;    

	overflow: hidden;

	height: 700px;

	padding: 0px;

}

#thankyou-content {

	background: #d2d2d2;

   padding-top: 96px;

   padding-bottom: 78px;

	color: #777;

}


.content-half{
	margin-top: 30px;
}

.content-half2{
	border-left: 1px solid #ccc;
}

.thankyou-copy{

	position: relative; top:30%;left: 60%; width: 40%;

}





/* Flex Slider

/* ------------------------------------------------------------------ */



/* Reset */

.flexslider a:active,

.flexslider a:focus  { outline: none; }

.slides,

.flex-control-nav,

.flex-direction-nav { margin: 0; padding: 0; list-style: none; }

.slides li { margin: 0; padding: 0;}



/* Necessary Styles */

.flexslider {

   position: relative;

   zoom: 1;

   margin: 0;

   padding: 0;

}

.flexslider .slides { zoom: 1; }

.flexslider .slides > li { position: relative; }



/* Hide the slides before the JS is loaded. Avoids image jumping */

.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }

/* Suggested container for slide animation setups. Can replace this with your own */

.flex-container { zoom: 1; position: relative; }



/* Clearfix for .slides */

.slides:before,

.slides:after {

   content: " ";

   display: table;

}

.slides:after {

   clear: both;

}



/* No JavaScript Fallback */

/* If you are not using another script, such as Modernizr, make sure you

 * include js that eliminates this class on page load */

.no-js .slides > li:first-child { display: block; }



/* Slider Styles */

.slides { zoom: 1; }

.slides > li {

   /*margin-right: 5px; */

   overflow: hidden;

}



/* Control Nav */

.flex-control-nav {

   width: 100%;

   text-align: center;

}

.flex-control-nav li {

   margin: 0 6px;

   display: inline-block;

   zoom: 1;

   *display: inline;

}

.flex-control-paging li a {

   width: 12px;

   height: 12px;

   display: block;

   background: #ddd;

   background: rgba(255, 255, 255, .3);

   cursor: pointer;

   text-indent: -9999px;

   border-radius: 20px;

   box-shadow: inset 0 0 3px rgba(255, 255, 255, .3);

}

.flex-control-paging li a:hover {

    background: #CCC;

    background: rgba(255, 255, 255, .7);

}

.flex-control-paging li a.flex-active {

    background: #fff;

    background: rgba(255, 255, 255, .9);

    cursor: default;

}





/* ------------------------------------------------------------------ */

/* i. Subscribe Section

/* ------------------------------------------------------------------ */



#subscribe {

   background: #23292F;

   padding-top: 96px;

   padding-bottom: 66px;

   overflow: hidden;

   text-align: center;

}



#subscribe a, #subscribe a:visited  { color: #fff; }

#subscribe a:hover, #subscribe a:focus { color: #b28c35; }



#subscribe h1 { color: #fff; }

#subscribe p {

   color: #7A7A7A;

   text-align: center;

   padding: 0;

}



/* mailchimp signup form */

#mc_embed_signup {

   background: none;

   clear: both;

   display: block;

   margin: 6px auto 30px auto;

   width: 70%;

  	text-align: center;   

}

#mc_embed_signup:before,

#mc_embed_signup:after {

    content: " ";

    display: table;

}

#mc_embed_signup:after {

    clear: both;

}

#mc_embed_signup input[type="submit"] {

   float: right;

   height: 60px;

   margin: 0;

   padding: 0 20px;

   font-size: 16px;

   line-height: 60px;

   width: 47%;  

}

#mc_embed_signup input[type="email"] {

   display: inline;

   float: left;

   height: 60px;

   margin: 0;

   padding: 18px 20px;

   font-size: 18px;

   line-height: 24px;

   font-family: 'montserrat-regular',sans-serif;

   width: 47%;  

   text-align: center;

}





/* ------------------------------------------------------------------ */

/* j. Footer

/* ------------------------------------------------------------------ */



footer {

	
   padding-top: 84px;

   margin-bottom: 60px;

   color: #777;

   font-size: 13px;

   line-height: 24px;

   position: relative;   

}



footer a, footer a:visited { color: #0A6567; }

footer a:hover, footer a:focus { color: #fff; }



footer .info { padding-right: 0px; }



footer .footer-logo a {

   display: block;

   margin-bottom: 12px;

   margin-top: 12px;

   margin-left: 3px;

}

footer .footer-logo a img {

   height: 24px;

   width: 92px;

}



footer .right-cols .columns {

   padding-right: 5px;

   padding-left: 5px;

   width: 33.33333%; ;

}

footer .right-cols .columns p { margin-bottom: 6px; }



footer h3 {

   font: 13px/24px 'opensans-semibold', sans-serif;

   margin-bottom: 0;

   font-weight: normal;

   color: #fff;

   text-transform: uppercase;

   letter-spacing: 1px;

}

footer h3:before {

   font-family: 'FontAwesome';   

	margin: 0 0 6px 3px;

	font-size: 30px;

   line-height: 48px;

   text-align: left;

   color: #738291;

   display: block;

}

footer h3.address:before { content: "\f041"; }

footer h3.social:before { content: "\f0c0"; }

footer h3.contact:before { content: "\f0e0"; }



footer ul {

   margin: 0;

   padding: 0;

}

footer ul li {

   margin: 0;

   line-height: 24px;

}

footer ul li a,

footer ul li a:visited { color: #3c4753; }

footer ul li a:hover,

footer ul li a:focus { color: #fff; }



/* copyright */

footer .copyright {

   margin: 0;

   padding: 0 18px;

   clear: both;

}



/* Go To Top Button */

#go-top {

	position: absolute;

	top: -24px;

   left: 50%;

   margin-left: -30px;

   text-align: center;

   z-index: 889;

}

#go-top a {

	text-decoration: none;

	border: 0 none;

	display: block;

	width: 60px;

	height: 60px;

	background: #525252;



	-webkit-transition: all 0.2s ease-in-out;

   -moz-transition: all 0.2s ease-in-out;

   -o-transition: all 0.2s ease-in-out;

   -ms-transition: all 0.2s ease-in-out;

   transition: all 0.2s ease-in-out;



   color: #fff;

   font-size: 21px;

   line-height: 60px;

 	border-radius: 100%;

}

#go-top a:hover { background: #b28c35; }





/* ------------------------------------------------------------------ */

/* k. lightbox

/* ------------------------------------------------------------------ */



#imagelightbox {

   cursor: pointer;

   position: fixed;

   z-index: 995;

   -ms-touch-action: none;

   touch-action: none;

   -webkit-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */

   -moz-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */

   box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */

}



/* activity indication */

#imagelightbox-loading,

#imagelightbox-loading div { border-radius: 50%; }

#imagelightbox-loading {

   width: 2.5em; /* 40 */

   height: 2.5em; /* 40 */

   background-color: #444;

   background-color: rgba( 0, 0, 0, .5 );

   position: fixed;

   z-index: 999;

   top: 50%;

   left: 50%;

   padding: 0.625em; /* 10 */

   margin: -1.25em 0 0 -1.25em; /* 20 */

   -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3 ); /* 40 */

   -moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3 ); /* 40 */

   box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3 ); /* 40 */

}

#imagelightbox-loading div {

   width: 1.25em; /* 20 */

   height: 1.25em; /* 20 */

   background-color: #fff;



   -webkit-animation: imagelightbox-loading .5s ease infinite;

   -moz-animation: imagelightbox-loading .5s ease infinite;

   -o-animation: imagelightbox-loading .5s ease infinite;

   animation: imagelightbox-loading .5s ease infinite;

}



@-webkit-keyframes imagelightbox-loading {

	from { opacity: .5; -webkit-transform: scale( .75 ); }

	50% { opacity: 1; -webkit-transform: scale( 1 ); }

	to { opacity: .5; -webkit-transform: scale( .75 ); }

}   

@-moz-keyframes imagelightbox-loading {

	from { opacity: .5; -moz-transform: scale( .75 ); }

	50% { opacity: 1; -moz-transform: scale( 1 ); }

	to { opacity: .5; -moz-transform: scale( .75 ); }

}

@-o-keyframes imagelightbox-loading {

	from { opacity: .5; -o-transform: scale( .75 ); }

	50% { opacity: 1; -o-transform: scale( 1 ); }

	to { opacity: .5; -o-transform: scale( .75 ); }

}

@keyframes imagelightbox-loading {

	from { opacity: .5; transform: scale( .75 ); }

	50% { opacity: 1; transform: scale( 1 ); }

	to { opacity: .5; transform: scale( .75 ); }

}



/* lightbox overlay */

#imagelightbox-overlay {

   background-color: #383838;

   background-color: rgba( 0, 0, 0, .8 );

   position: fixed;

   z-index: 994;

   top: 0;

   right: 0;

   bottom: 0;

   left: 0;

}



/* close button */

#imagelightbox-close {	  

   position: fixed;

   z-index: 999;

   top: 2.5em; /* 40 */

   right: 2.5em; /* 40 */ 

}



#imagelightbox-close i {	  

	display: block;

	background: #fff;

	padding: 10px;

	border-radius: 100%;



	-webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */

	-moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */

	box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */

}

a#imagelightbox-close { color: #333; }

a#imagelightbox-close:hover, a#imagelightbox-close:focus { color: #b28c35; }



/* lightbox caption */

#imagelightbox-caption {

	text-align: center;

	color: #fff;

	background-color: #000;

	position: fixed;

	z-index: 999;

	left: 0;

	right: 0;

	bottom: 0;

	padding: 0.625em; /* 10 */

}



#imagelightbox-loading,

#imagelightbox-overlay,

#imagelightbox-close,

#imagelightbox-caption {

	-webkit-animation: fade-in .25s linear;

	-moz-animation: fade-in .25s linear;

	-o-animation: fade-in .25s linear;

	animation: fade-in .25s linear;

}



@-webkit-keyframes fade-in {

	from { opacity: 0; }

	to { opacity: 1; }

}

@-moz-keyframes fade-in {

	from { opacity: 0; }

	to { opacity: 1; }

}

@-o-keyframes fade-in {

	from { opacity: 0; }

	to { opacity: 1; }

}

@keyframes fade-in {

	from { opacity: 0; }

	to { opacity: 1; }

}



@media only screen and (max-width: 41.250em) { /* 660 */



	#container	{ width: 100%; }

	#imagelightbox-close	{

		top: 1.25em; /* 20 */

		right: 1.25em; /* 20 */

	}



} 



	@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {

		.htmlBackground{
			font: 18px 'Bree Serif', serif;			
		}
		
		#countdown h1, #dining_square h1, #gathering h1, #rotisserie  h1, #logcakes h1, #goodies h1{
			color:black;
			font: 22px 'Pacifico', cursive;
		}
		
	  /* For landscape layouts only */

	  #hero{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_t.jpg);
			background-position: top center;			
			background-repeat: no-repeat;
			width: 100%;
			/*background-attachment: fixed;*/
			/*background-size: cover;*/
			background-size: cover;
			overflow: hidden;		

		}

		

	  #countdown-heading,#dining_square-heading, #gathering-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			/*background-attachment: fixed;*/
			/*background-size: cover;*/
			background-size: cover;
			/*overflow: hidden;	*/		

		}

		
		/*
	  #dining_square-heading{
			margin-top: 0;
			background: #efeff1 url(../images/bg_yuletide_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;			

		}

		

	  #dining_kinta-heading{
			margin-top: 0;
			background: #efeff1 url(../images/bg_kinta_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;		

		}

		

	  #gathering-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_gathering_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;			

		}

		

	  #staycation-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_staycation_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;			

		}

		

	  #yuletide-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_takeaway_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;			

		}

	  #takeaway-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_takeaway_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			background-size: cover;
			overflow: hidden;			

		}
		*/
		.countdown-copy-mobile,.dining_square-copy-mobile, .gathering-copy-mobile, .yuletide-copy, .dining_square-copy, .dining_kinta-copy, .gathering-copy, .staycation-copy, .yuletide-copy, .takeaway-copy{

			position: relative; top:35%;left: 0%; width: auto;

		}

		.countdown-copy-mobile,.dining_square-copy-mobile, .gathering-copy-mobile{

			display: block;

		}

		.countdown-copy,.dining_square-copy, .gathering-copy{

			display: none;

		}
		
		

	}







	/* Smaller than standard 960 (devices and browsers) */

	@media only screen and (min-width: 481px) and (max-width: 959px) {

		.htmlBackground{
			font: 18px 'Bree Serif', serif;					
		}		

		#countdown h1, #dining_square h1, #gathering h1, #rotisserie  h1, #logcakes h1, #goodies h1{
			color:black;
			font: 22px 'Pacifico', cursive;
		}	
		
		 #countdown-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_t.jpg);
			background-position: top center;
			background-repeat: no-repeat;
			width: 100%;
			/*background-attachment: fixed;*/
			/*background-size: cover;*/
			background-size: cover;
			overflow: hidden;			

		}

		.countdown-copy-mobile, .dining_square-copy-mobile, .gathering-copy-mobile, .yuletide-copy, .dining_square-copy, .dining_kinta-copy, .gathering-copy, .staycation-copy, .yuletide-copy, .takeaway-copy{

			position: relative; top:35%;left: 0%; width: auto;

		}

		.countdown-copy-mobile, .dining_square-copy-mobile, .gathering-copy-mobile{

			display: block;

		}

		.countdown-copy,.dining_square-copy, .gathering-copy{

			display: none;

		}
		
		
		.content-half{
			margin-top: 30px;
		}
		
		.content-half2{
			border-left: 1px solid #ccc;
			border-top: 0px;
		}

	}
	
	@media only screen and (max-width: 740px) {

		.htmlBackground{
			font: 18px 'Bree Serif', serif;			
		}
		
		#countdown h1, #dining_square h1, #gathering h1,#rotisserie  h1, #logcakes h1, #goodies h1{
			color:black;
			font: 22px 'Pacifico', cursive;
		}	
		
		.content-half{
			margin-top: 30px;
		}
		
		.content-half2{
			border-left: 0px;
			border-top: 1px solid #ccc;
			padding-top: 10px;
		}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

	@media only screen and (max-width: 480px) {

		.htmlBackground{
			font: 15px 'Bree Serif', serif;				
		}
		
		#countdown h1, #dining_square h1, #gathering h1, #rotisserie  h1, #logcakes h1, #goodies h1{
			color:black;
			font: 22px 'Pacifico', cursive;
		}		
		
		#navi-wrapper{

		   display: none;			

		}

		#navi-wrapper-mobile{

		   display: block;			

		}		

		

		#hero{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;
			background-attachment: fixed;
			/*background-size: cover;*/
			background-height: auto 100%;
			height: 380px;
			overflow: hidden;			

		}

		#hero .header_spacing {			

			position: relative; top:35%;left: 0%; width: auto;

		} 

		#countdown-heading, #dining_square-heading, #gathering-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			/*background-attachment: fixed;*/
			/*background-size: cover;*/
			overflow: hidden;	
			/*height: 250px;*/	

		}
		/*
		#dining_square-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;	
			height: 250px;	

		}

		#dining_kinta-heading{
			margin-top: 0;
			background: #efeff1 url(../images/bg_hero_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;	
			height: 250px;		

		}

		#gathering-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_gathering_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;	
			height: 250px;		

		}

		#staycation-heading{
			margin-top: 0;
			background: #efeff1 url(../images/bg_staycation_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;					
			height: 250px;		

		}

		#yuletide-heading{
			margin-top: 0;
			background: #efeff1 url(../images/bg_takeaway_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;	
			height: 250px;		

		}

		#takeaway-heading{

			margin-top: 0;
			background: #efeff1 url(../images/bg_takeaway_m.jpg);
			background-position: top center;
			background-repeat: no-repeat;	
			width: 100%;
			background-attachment: fixed;
			background-size: cover;
			overflow: hidden;		
			height: 250px;		

		}
		*/
		.countdown-copy-mobile, .dining_square-copy-mobile, .gathering-copy-mobile, .yuletide-copy, .dining_square-copy, .dining_kinta-copy, .gathering-copy, .staycation-copy, .yuletide-copy, .takeaway-copy{

			position: relative; top:35%;left: 0%; width: auto;

		}

		.countdown-copy-mobile, .dining_square-copy-mobile, .gathering-copy-mobile{

			display: block;

		}

		.countdown-copy, .dining_square-copy, .gathering-copy{

			display: none;

		}
		#features, #countdown-content, #dining_square-content, #dining_kinta-content, #gathering-content, #staycation-content, #yuletide-content, #takeaway-content{
			margin-top: 0;
			background: #fbfafa url('../images/bg_text_m.jpg') no-repeat center bottom ;

			/*background-attachment: fixed;*/
			/*background-size: cover;*/
			overflow: hidden;	
		}
		
		
		.content-half{
			margin-top: 30px;
		}
		
		.content-half2{
			border-top: 1px solid #d00;
			border-left: 0px;
		}

	}