/* LAST ORDERS FOR CHRISTMAS =============================================================================  */

/*  IMPORT FONTS  ============================================================================= */

@font-face {
    font-family: 'LatoRegular';
    src: url('/fonts/Lato-Regular-webfont.eot');
    src: url('/fonts/Lato-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Lato-Regular-webfont.woff') format('woff'),
         url('/fonts/Lato-Regular-webfont.ttf') format('truetype'),
         url('/fonts/Lato-Regular-webfont.svg#LatoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LatoBold';
    src: url('/fonts/Lato-Bold-webfont.eot');
    src: url('/fonts/Lato-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Lato-Bold-webfont.woff') format('woff'),
         url('/fonts/Lato-Bold-webfont.ttf') format('truetype'),
         url('/fonts/Lato-Bold-webfont.svg#LatoBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face
{
    font-family: 'JournalRegular';
    src: url('/fonts/journal-webfont.eot');
    src: url('/fonts/journal-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/journal-webfont.woff') format('woff'),
         url('/fonts/journal-webfont.ttf') format('truetype'),
         url('/fonts/journal-webfont.svg#JournalRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lobster13Regular';
    src: url('/fonts/lobster_1.3-webfont.eot');
    src: url('/fonts/lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/lobster_1.3-webfont.woff') format('woff'),
         url('/fonts/lobster_1.3-webfont.ttf') format('truetype'),
         url('/fonts/lobster_1.3-webfont.svg#Lobster13Regular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* BASIC PAGE SETUP ============================================================================= */

body { 
margin : 0 auto;
padding : 0;
font : 100%/1.4 'LatoRegular', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
color : #fff; 
text-align: center;
background-color: white;
}

#ieBGFix {
	float:left;width:100%;
	margin: 0px;
	padding: 0px;
	background: #ffffff url(/images/scene.jpg) repeat-x center -760px;
 background: url(/images/gradient.png) repeat-x left top, url(/images/scene.jpg) repeat-x center -760px;
}

button, 
input, 
select, 
textarea { 
font-family : 'LatoRegular', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 
color : #000; }

/*  HEADINGS  ============================================================================= */

h1, h2, h3, h4, h5, h6 {
font-family:  LatoBold, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif;
letter-spacing: -1px; 
font-weight : normal;
margin-top: 0px;
}

h1 { 
color: #003366;
font-family: Lobster13Regular, LatoBold, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif;
margin-bottom : 0.8em;
font-size : 2.5em; /* 48 / 16 = 3 */
padding-right: 30px;
line-height : 1;
text-shadow: 2px 2px 5px rgba(0,0,0,.2);
}

h1.home
{
	text-align: right;
	font-size: 3.7em;
	margin-bottom: 15px;
  margin-right: 5px;
	height: 60px;
}

h2 { 
color: #003366;
margin-bottom : .5em;
font-size : 2em; /* 36 / 16 = 2 */
line-height : 1.2;
text-shadow: 2px 2px 4px rgba(0,0,0,.2);
}

h3 { 
color: #003366;
margin-bottom : 1em;
font-size : 1.75em; /* 28 / 16 = 1.5 */
line-height : 1.3; }

h4 { 
color: #003366;
margin-bottom : 0.5em;
font-size : 1.5em; /* 24 / 16 = 1.25 */
line-height : 1.25; }

h5 { 
color: #003366;
margin-bottom : 1.5em;
font-size : 1em; /* 16 / 16 = 1 */ }

h6 { 
color: #003366;
font-size : 1em; /* 16 / 16 = 1 */ }

/*  TYPOGRAPHY  ============================================================================= */

p, ol, ul, dl, address { 
margin-bottom : 1.5em; 
font-size : 1em; /* 16 / 16 = 1 */ }

p {
hyphens : auto;  }

p.handwritten {
font-family:  'JournalRegular', 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 
font-size: 1.5em; /* 24 / 16 = 1.5 */
margin-bottom: 0;
text-shadow: 2px 2px 5px rgba(0,0,0,.2);
}

p.center {
text-align: center;
}

ul, 
ol { 
margin : 0 0 1.5em 0; 
padding : 0 0 0 24px; }

li ul, 
li ol { 
margin : 0;
font-size : 1em; /* 16 / 16 = 1 */ }

dl, 
dd { 
margin-bottom : 1.5em; }

dt { 
font-weight : normal; }

b, strong { 
font-weight : bold; }

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

small { 
font-size : 1em; /* 16 / 16 = 1 */ }

sub, sup { 
font-size : 75%; 
line-height : 0; 
position : relative; 
vertical-align : baseline; }

sup { 
top : -.5em; }

sub { 
bottom : -.25em; }

/* LINKS =============================================================================  */

a { 
color : #ffffff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

a:visited { 
color : #ffffff; }

a:focus { 
outline : thin dotted; 
color : rgb(0,0,0); }

a:hover, 
a:active { 
outline : 0;
color : #ff9900
}

footer a { 
color : #003366;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

footer a:visited { 
color : #003366; }

footer a:focus { 
outline : thin dotted; 
color : rgb(0,0,0); }

footer a:hover, 
footer a:active { 
outline : 0;
color : #6699cc
}

/* IMAGES ============================================================================= */

img {
border : 0;
max-width: 100%;}


/* TABLES ============================================================================= */

table { 
border-collapse : collapse;
border-spacing : 0;
margin-bottom : 1.4em; 
width : 100%;
font-size : .875em; /* 14 / 16 = .875 */ }

th, td, caption { 
padding : .25em 10px .25em 5px; }

tfoot { 
font-style : italic; }

caption { 
background-color : transparent; }

/* FORMS ============================================================================= */

form { 
margin : 0; }

fieldset { 
margin-bottom : 1.5em; 
padding : 0; 
border-width : 0; }

legend { 
*margin-left : -7px; 
padding : 0; 
border-width : 0; }

label { 
font-weight : normal;
cursor : pointer; }

button, 
input, 
select, 
textarea { 
font-size : 100%; 
margin : 0; 
vertical-align : baseline; 
*vertical-align : middle; }

button, input { 
line-height : normal; 
*overflow : visible; }

button, 
input[type="button"], 
input[type="reset"], 
input[type="submit"] { 
cursor : pointer; }

input[type="checkbox"], 
input[type="radio"] { 
box-sizing : border-box; }

input[type="search"] { 
	box-sizing : content-box;
}

button::-moz-focus-inner, 
input::-moz-focus-inner { 
padding : 0;
border : 0;  }

textarea { 
overflow : auto; 
vertical-align : top; }

/* Colors for form validity */
input:valid, 
textarea:valid   {  
/* Styles */ }

input:invalid, 
textarea:invalid {
-webkit-box-shadow : 0 0 2px #f00; 
-moz-box-shadow : 0 0 2px #f00;
box-shadow : 0 0 2px #f00; }

.no-boxshadow input:invalid, 
.no-boxshadow textarea:invalid {
background-color : #ccc; }

/*Search form */

form#footerSearchForm button {
margin: 3px 0 0 0;
background: #88aacc;
border: none;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
border-radius: 6px;
color: #000000;
display: block;
letter-spacing: 1px;
padding: 6px 10px;
text-transform: uppercase;
}
form#footerSearchForm button:hover {
background: #99bbdd;
cursor: pointer;
}
form#footerSearchForm input[type="search"] { 
	width:90%;
	margin:0 0 1em 0;
	border:1px #ccc solid;
	padding:6px;
	border-radius:6px;
	max-width:300px;
}

/*
*************************************************

THE RESPONSIVE GRID SYSTEM
Taken from http://www.responsivegridsystem.com/

*************************************************
*/
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 2.5%;
}
.col:first-child { margin-left: 0; }
/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}

.span_5_of_6 {	width:82.9166666667%; }
	.span_4_of_6 { width:65.8333333333%; }
		.span_3_of_6 { width:48.75%; }
			.span_2_of_6 { width:31.6666666667%; }
				.span_1_of_6 { width:14.5833333333%; }

.span_6_of_7 { width:85.3571428571%; }
	.span_5_of_7 {	width:70.7142857143%; }
		.span_4_of_7 { width:56.0714285714%; }
			.span_3_of_7 { width:41.4285714286%; }
				.span_2_of_7 { width:26.7857142857%; }
					.span_1_of_7 { width:12.1428571429%; }
						
.span_7_of_8 { 	width:87.1875%; }
	.span_6_of_8 { width:74.375%; }
		.span_5_of_8 {	width:61.5625%; }
			.span_4_of_8 { width:48.75%; }
				.span_3_of_8 { width:35.9375%; }
					.span_2_of_8 { width:23.125%; }
						.span_1_of_8 { width:10.3125%; }

/*  MAIN LAYOUT	============================================================================= */

/* Section is for the snow */
section {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	overflow: hidden;
}

#wrapper {
	clear: both;
	position: relative;
	width: 920px;
	margin: 0 auto;
	text-align: left;
	z-index: 20;	

}



	header {
		padding-top: 1em;
		text-align: center;
   		position: relative;
	}
	
	#logo
	{
		position: absolute;
		top: 0px;
		left: -50px;
		z-index: 100;
	}

	#content {
		text-align: center;

	}

	footer {
		
		margin: 30px 0 20px 0;
		position: relative;
		text-align: left;
		font-size : .75em; /* 12 / 16  */
		color: #003366;
		background:rgba(255,255,255,0.7);
		border-radius:8px;
		width:94%; padding:1em 3%;
	}	

	.footeritem {
		float: left;
		width: 22%;
		margin: 0 4% 1% 0;
		
	}	


	.footeritem:nth-child(4n) {
	    	margin-right: 0;
	}





	#share
	{
		clear: both;
		position: relative;
		text-align: center;
	}

		#share-logos
		{
			position: relative;
			width: 320px;
			margin: 0 auto;
			text-align: center;
		}

			.social {
				float: left;
				padding-right: 0px;
				overflow:hidden;
			}

	#credits
	{
		padding:1em 0; clear: both;
		position: relative;
		text-align: center;
		color: #036;
		font-size: 0.9167em;
	}


/*  CALENDAR =================================================================================== */


ol.calendar    {
	float:left;
	width:100%;
	margin:0 auto 50px auto;
	display:block; 
	padding: 0px;
	}
	
ol.calendar li {
	list-style:none;
	}
	
	
/*
 * Day styles
 -------------------------*/
ol.calendar li li {
	width:6.6em;
	height:6.6em;
	float:left;
	margin:.2em;
	padding:.4em;
	overflow:hidden;
	background: #69a;
	background: rgba(136, 170, 204, 0.50);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	
	}

ol.calendar li li
{
	position: relative;
  overflow: visible;
}

.hoverContent
{
	position: absolute;
	top: -25%;
	left: -25%;
	background: #036;
	background: rgba(0, 51, 102, 0.85);
	width: 130%;
	min-height: 130%;
	display: none;
	z-index: 100;
	font-size: 1em;
	padding: 10%;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
border: 1px solid #036;
border-color: rgba(255,255,255,0.25);
z-index:250; 
}

ol.calendar li li:hover .hoverContent { display:block;  }

li.today .hoverContent
{
	background: rgb(255, 153, 0);	
	background: rgba(255, 153, 0, 0.75);	
}

li.today a:hover
{
	color: #036;
}

.hoverContent p
{
	font-size: 1em;
}

.dateNumber
{
	font-size: 1.1em;

	text-decoration: none;
	display: block;
	font-weight:bold;
}

/*
 * Day content (UL/OL & P)
 -------------------------*/
li li > p  	 {font-size:.7em;display:block; overflow: hidden; height: 7.6em;}
li li ol         {width:auto;}
li li ul li,
li li ol li      {font-size:.7em;display:block;height:auto;width:auto; background: none; margin:0;padding:.2em 0;float:none;}

/*
 * Today class
 -------------------------*/
ol.calendar li li.today    { 
	background: #f90;
	background: rgba(255, 153, 0, 0.50);	
	}

/*
 * Inactive months
 -------------------------*/
li#lastmonth li,
li#nextmonth li    { background: none;}	


.shopnameLink { float:left; width:100%; }

/*  SHOP =============================================================================================== */

#shop {
	text-align: center;

}

#date {
	font-size : 5.0em; /* 74 / 16 = 5 */
	text-shadow: 2px 2px 5px rgba(0,0,0,.2);
	padding: 30px 0px;
}


.button {
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #fff;
	padding: .5em 1em;
	margin: .5em 0 1em 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 0 4px rgba(0,0,0,.2);
	-moz-box-shadow: 0 0 4px rgba(0,0,0,.2);
	box-shadow: 0 0 4px rgba(0,0,0,.2);
	}
	
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}

#shop p.buttonlink .visitbutton, #content p.buttonlink .visitbutton {
	font-size : 2.0em; /* 32 / 16 = 2 */
	color: #ffffff;
	text-decoration: none;
	border: solid 1px #cc6600;
	background: #ff9900;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#shop p.buttonlink .visitbutton:hover, #content p.buttonlink .visitbutton:hover {
	color: #ffffff;
	text-decoration: none;
 	border: solid 1px #336600;
	background: #669933;
}

#shop p.buttonlink .visitbutton:active, #content p.buttonlink .visitbutton:active {
	color: #ffffff;
	text-decoration: none;
	background: #779944;
	background: -webkit-gradient(linear, left top, left bottom, from(#88a956), to(#789946));
	background: -moz-linear-gradient(top,  #88a956,  #789946);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#88a956', endColorstr='#789946');
}

#shop p.shareontwitter  { 
	clear: both; 
	width: 300px;
	margin: 0 auto;
	padding: 0 0 30px 0; 
	}
	
#shop p.shareontwitter span { 
	font-size: 30px; 
	font-family: JournalRegular, 'Myria Pro', Myriad, 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif; 
	float: left; 
	margin-right: 10px; 
	margin-top: -14px;
	}


/*  DATE =============================================================================================== */


#lastdate {
	text-align: left;
	width: 70%;
	margin: 0 auto;
	padding: 5%;
	font-size : 1.5em; /* 24 / 16 = 1.5 */
	text-shadow: 2px 2px 5px rgba(0,0,0,.2);

}

	.twocolumns {
		-webkit-column-count:2;
		-moz-column-count:2;
		column-count:2;
		-webkit-column-width:40%;
		-moz-column-width:40%;
		column-width:40%;
		-webkit-column-gap:20%;
		-moz-column-gap:20%;
		column-gap:20%;

	}
	
	
/*  SEARCH RESULTS =============================================================================================== */


.searchresults {
	font-size : 2em; /* 32 / 16 = 2 */
	text-shadow: 2px 2px 5px rgba(0,0,0,.2);
	padding: 30px 0px;
}

/*  TESTIMONIALS BUBBLES  ============================================================================= */

.speechbubble {
	position:relative;
	padding:5%;
	margin:0;
	color:#000;
	background:#88aacc; /* default background for browsers without gradient support */
	font-style: normal;
	
	
	/* css3 */
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	/* NOTE: webkit gradient implementation is not as per spec */
	background:-webkit-gradient(linear, left top, left bottom, from(#99bbdd), to(#88aacc));
	background:-moz-linear-gradient(top, #99bbdd, #88aacc);
	background:-o-linear-gradient(top, #99bbdd, #88aacc);
}

/* display of quote author (alternatively use a class on the element following the blockquote) */
.speechbubble + p {margin:15px 0 2em 85px; font-style:italic;}

/* creates the triangle */
.speechbubble:after {
	content:"";
	display:block; /* reduce the damage in FF3.0 */
	position:absolute;
	bottom:-50px;
	left:50px;
	width:0;
	height:0;
	border-width:0 20px 50px 0px;
	border-style:solid;
	border-color:transparent #88aacc;
}



/*  GLOBAL OBJECTS ============================================================================= */

.breaker { clear: both; }

.clearfix:before, 
.clearfix:after { 
content : "\0020"; 
display : block; 
height : 0; 
overflow : hidden; }

.clearfix:after { 
clear : both; }


/* VENDOR-SPECIFIC ============================================================================= */

html { 
-webkit-overflow-scrolling : touch; 
-webkit-tap-highlight-color : rgb(52,158,219); 
-webkit-text-size-adjust : 100%; 
-ms-text-size-adjust : 100%; }

.clearfix { 
zoom : 1; }

::-webkit-selection { 
background : rgb(23,119,175); 
color : rgb(250,250,250); 
text-shadow : none; }

::-moz-selection { 
background : rgb(23,119,175); 
color : rgb(250,250,250); 
text-shadow : none; }

::selection { 
background : rgb(23,119,175); 
color : rgb(250,250,250); 
text-shadow : none; }

button, 
input[type="button"], 
input[type="reset"], 
input[type="submit"] { 
-webkit-appearance : button; }

::-webkit-input-placeholder {
font-size : .875em; 
line-height : 1.4; }

input:-moz-placeholder { 
font-size : .875em; 
line-height : 1.4; }

.ie7 img,
.iem7 img { 
-ms-interpolation-mode : bicubic; }

input[type="checkbox"], 
input[type="radio"] { 
box-sizing : border-box; }

input[type="search"] { 
-webkit-box-sizing : content-box;
-moz-box-sizing : content-box; }

button::-moz-focus-inner, 
input::-moz-focus-inner { 
padding : 0;
border : 0; }

p {
/* http://www.w3.org/TR/css3-text/#hyphenation */
-webkit-hyphens : auto;
-webkit-hyphenate-character : "\2010";
-webkit-hyphenate-limit-after : 1;
-webkit-hyphenate-limit-before : 3;
-moz-hyphens : auto; }

/*  MEDIA QUERIES ============================================================================= */

@media screen and (max-width: 1024px) {
	
	#logo { left:0; }
	h1.home { float:right; font-size:3em; padding:0.5em 0 0 0; }
}
@media screen and (max-width: 960px) {
	
	#wrapper { width: 90%; }
	
	
	h1.home { font-size:2.5em; }
	
	#lastdate {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	font-size:1.3em;
}

	.twocolumns {
		-webkit-column-count:1;
		-moz-column-count:1;
		column-count:1;
		-webkit-column-width:100%;
		-moz-column-width:100%;
		column-width:100%;
		-webkit-column-gap:0%;
		-moz-column-gap:0%;
		column-gap:0%;

	}
}

@media screen and (max-width: 860px) {
	
	#ieBGFix
	{
		background: #ffffff url(/images/scene.jpg) repeat-x center top;
	 background: url(/images/gradient.png) repeat-x left top, url(/images/scene.jpg) repeat-x center top;
	}

	ol.calendar, footer { float:left; clear:both; }
	
	
}

@media screen and (max-width: 768px) {
	h1.home {  font-size:2.5em; padding:0.5em 0 0 0; }
	#logo { float:left; margin:0; width:100px; top:0; left:0; position:relative; }
	
	/* Last Day for Shop is... */
	#date { font-size:2.9em; }
	#shop p.buttonlink .visitbutton, #content p.buttonlink .visitbutton { font-size:1.5em; }
}

@media screen and (max-width: 700px) {
	h1.home {  font-size:2em;  }
}

@media screen and (max-width: 600px) {
	.span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6,
	.span_1_of_7, .span_2_of_7, .span_3_of_7, .span_4_of_7, .span_5_of_7, .span_6_of_7, .span_7_of_7,
	.span_1_of_8, .span_2_of_8, .span_3_of_8, .span_4_of_8, .span_5_of_8, .span_6_of_8, .span_7_of_8, .span_8_of_8 
	{ width: 100%; margin:0 0 1em 0; }
	
	h1.home {  font-size:1.5em; padding:1em 0 0 0; }
	
	ol.calendar { margin:-1em 0 0 0; }
	ol.calendar li li {
	background: #69a;
	background: rgba(136, 170, 204, 0.80);
	width:37%;
	height:auto;
	float:left;
	margin:0 0 1em 0;
	padding:0 5% 10px 5%;
	overflow:visible;	
	}
	ol.calendar li li:nth-child(even) { clear:both; margin-right:10px; }
	.dateNumber { padding-top:0.5em; }
	.hoverContent { display:none !important; }
	li li > p  	 { overflow: visible; height: auto;}
	
	.shopnameLink { font-size:1.3em; margin-bottom:0.2em; }

	
	footer {  background:#fff;margin-top:0; }
	
	
}

@media screen and (max-width: 480px) {
	
	h1.home { float:left; clear:both; width:100%; padding:0; margin:0; text-align:center; }
	#logo { float:none; }
	
	ol.calendar { margin:-3.5em 0 0 0; border-bottom:2px #ccc dotted; }
		ol.calendar li li { width:80%; margin-right:0; }
		ol.calendar li li:nth-child(odd) { margin-right:0; }
	
	#share-logos { width:100%; }
	.social { clear:both; margin:0 0 1em 0; }
	footer {  margin-top:0; width:90%; padding:1em 5%; }
	
	/* Last Day for Shop is... */
	#date { font-size:1.9em; }
	#shop p.buttonlink .visitbutton, #content p.buttonlink .visitbutton { font-size:1em; }
	#shop p.shareontwitter { text-align:center; width:100%; }
	#shop p.shareontwitter span { float:none; margin:0 10px 0 0 ; }
	
	.searchresults { font-size:1.2em; }
}

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