@charset "utf-8";
/* CSS Document */

article, aside, dialog, figure, footer, header, hgroup, menu, nav, section { display: block; }

body {
	margin: 0;
	padding: 0;
	/*this is our original - */background: url(../images/arrows_down1.png) no-repeat;
	background: url(../images/bg1.png) no-repeat 100% 100%, url(../images/arrows_up.png) no-repeat 80% 100%, url(../images/bg2.png) no-repeat 90% 100%, url(../images/arrows_down1.png) no-repeat 0 0, url(../images/arrows_down2.png) no-repeat 15% 0%;
	/*background: url(../images/bg1.png) no-repeat 110% 95%, url(../images/arrows_up.png) no-repeat 60% 85%, url(../images/bg2.png) no-repeat 110% 75%, url(../images/arrows_down1.png) no-repeat -20px 0, url(../images/arrows_down2.png) no-repeat 15% 0%;*/
	background-color: #CFC69B;
	color: #000; /* IE 8 */
	color: rgba(0,0,0,0.6);
	font: 88% Segoe, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}
ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;	
}

/* LAYOUT -------------------------- */
header {
	overflow: auto; /* float containment */
	padding: 20px 0 40px 0;
}
header h1 {
	position: relative;
	z-index: 2;
	padding: 15px 3%;
	font-size: 300%;
	background-color: rgba(207,198,155,0.7);
}
header h1 em {
	position: relative;
	-moz-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg); /* doesn't work because it's not block */
	transform: rotate(-8deg);
	font-size: 150%;
	font-style: normal;
}
header h1 em:hover {
	-moz-transform: rotate(-5deg) scale(1.15);
	-o-transform: rotate(-5deg) scale(1.15);
	-webkit-transform: rotate(-5deg) scale(1.15);
	transform: rotate(-5deg) scale(1.15);
	text-shadow: 0 -1px 0 rgba(255,255,255,0.7), 0 1px 0 rgba(0,0,0,0.5);
}
nav {
	float: right;
	margin-top: -50px;
}
nav li {
	float: left; 
	min-width: 100px;
	padding: 0 5px;
	text-align: center;
	text-transform: uppercase;
}
nav em {
	display: block;
	height: 95px;
	width: 95px;
	margin: 0 auto;
	background: url(../images/bottle-cap1.png) no-repeat;
}
nav li:nth-child(2) em {
	background: url(../images/bottle-cap2.png) no-repeat;
}
nav li:nth-child(3) em {
	background: url(../images/bottle-cap3.png) no-repeat;
}
nav li:nth-child(4) em {
	background: url(../images/bottle-cap4.png) no-repeat;
}
@-webkit-keyframes rotate {
	from {
		-webkit-transform:rotate(0deg);
	}
	to {
		-webkit-transform:rotate(360deg);
	}
}
nav li:hover em {
	-webkit-animation-name: rotate;
	-webkit-animation-duration: 3s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}
nav a {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px 1px rgba(0,0,0,0.3);
}
nav a:hover { color: #000; }
#parties-map {
	position: fixed;
	left: 35%;
	width: 30%;
}
#parties-map img {
	width: 100%;	
}
#parties-map-gmap {
	width: 100%;
	height: 275px;	
}
#parties-for-you {
	float: left;
	width: 30%;
	margin: 0 0 30px 3%;
}
#parties-all {
	float: right;
	width: 30%;
	margin: 0 3% 30px 0;
}
footer {
	position: relative;
	z-index: 3;
	clear: both;
	padding: 15px 3%;
	background-color: #CFC69B; /* IE 8 */
	background-color: rgba(207,198,155,0.7);
	font-weight: bold;
}
footer p {
	margin-bottom: 1em;
	-moz-column-count: 3;
	-moz-column-gap: 1em;
	-webkit-column-count: 3;
	-webkit-column-gap: 1em;
	-o-column-count: 3; /*doesn't work*/
	-o-column-gap: 1em;
	column-count: 3;
	column-gap: 1em;
}
@media all and (max-width: 800px) {
	#parties-map {
		left: 3%;
		width: 42%;
	}
	#parties-for-you {
		float: right;
		width: 50%;
		margin-left: 0;
		margin-right: 3%;
	}
	#parties-all {
		clear: right;
		float: right;
		width: 50%;
	}
	#footer p {
		-moz-column-count: 2;
		-webkit-column-count: 2;
		column-count: 2;
	}
}

@media all and (max-device-width: 480px) {
	#header h1, nav {
		float: none;
	}
	nav {
		margin: 15px 0 0 3%;
	}
	nav li {
		clear: left;
		float: left;
		min-width: 0;
		margin: 0 0 5px 0;
		text-align: left;
	}
	nav em {
		display: block;
		float: left;
		height: 40px;
		width: 40px;
		margin: 0 5px 0 0;
		background: url(../images/bottle-cap1.png) no-repeat;
		-moz-background-size: 40px;
		-webkit-background-size: 40px;
	}
	nav li:nth-child(2) em {
		background: url(../images/bottle-cap2.png) no-repeat;
		-moz-background-size: 40px;
	}
	nav li:nth-child(3) em {
		background: url(../images/bottle-cap3.png) no-repeat;
		-moz-background-size: 40px;
	}
	nav li:nth-child(4) em {
		background: url(../images/bottle-cap4.png) no-repeat;
		-moz-background-size: 40px;
	}
	#parties-map {
		display: none;
	}
	#parties-for-you {
		float: none;
		width: 100%;
		margin: 0 3% 30px 3%;
	}
	#parties-all {
		float: none;
		width: 100%;
		margin: 0 3% 30px 3%;
	}
	#footer p {
		-moz-column-count: 1;
		-webkit-column-count: 1;
		column-count: 1;
	}
}

/* TEXT ---------------------------- */
@font-face {
 	font-family: 'BaileywickGothic';
 	src: url('BAILGJ__.eot');
 }
@font-face {
	font-family: 'BaileywickGothic';
	src: url(//:) format('no404'), url('BAILGJ__.woff') format('woff'), url('BAILGJ__.ttf') format('truetype');
}

p, h1, h2, h3, h4, h5, h6 { margin: 0; }
h1, h2, h3, h4 {
	font-family: "BaileywickGothic", Helvetica, Arial, sans-serif;
	text-shadow:0 2px 1px rgba(255,255,255,0.7);
}
h1, h2 {
	text-shadow: 0 1px 0 rgba(255,255,255,0.7), 0 -1px 0 rgba(0,0,0,0.5);
}
h2 {
	margin-bottom: 0.1em;
	font-size: 220%;
	font-weight: normal;
}
h3, h4 {
	margin-bottom: .2em;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 150%;
	line-height: 1;
}
a { color: #336274; }
h2 a {
	text-decoration: none;
	color: inherit;
}
h2 a:hover {
	color: rgba(0,0,0,1);
}

/* LISTS --------------------------- */
.parties-list ol { 
	margin: 15px 0 30px 0;
	padding: 0;
	-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.5);
	box-shadow: 0 1px 5px rgba(0,0,0,0.5);
	background: #fff;
	min-height: 200px;
}
#parties-for-you ol {
	border-width: 32px;
	border-bottom-width: 0;
	border-left-width: 0;
	-moz-border-image: url(../images/napkin.png) 32 32 32 32 repeat;
	-webkit-border-image: url(../images/napkin.png) 32 32 32 32 repeat;
	-o-border-image: url(../images/napkin.png) 32 32 32 32 repeat;
	border-image: url(../images/napkin.png) 32 32 32 32 repeat;
	background: #fff url(../images/paper.jpg);
	-moz-box-shadow: -1px 2px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: -1px 2px 5px rgba(0,0,0,0.5);
    box-shadow: -1px 2px 5px rgba(0,0,0,0.5); 
}
.no-borderimage #parties-for-you ol {
	background-image: none;
}
#parties-current ol {
	background: url(../images/stains1.png) no-repeat bottom left, url(../images/stains2.png) no-repeat top right, url(../images/paper.jpg);
}
#parties-startsoon ol {
	background: url(../images/stains3.png) no-repeat top right, url(../images/paper.jpg);
}
.parties-list ol li {
	margin: 0;
	padding: 10px;
}
#parties-all ol {
	list-style: none;
	margin:0;
	padding:0;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px; 
}

/* EVENTS -------------------------- */

.vevent a {
	color: inherit;
	text-decoration: none;
}
.vevent a:hover {
	color: rgba(0,0,0,1);
}
.location {
	display: block;
}
.distance {
	float: right;	
}
#parties-all ol li {
	border-bottom: solid 1px #ccc;
}
#parties-all ol li:last-of-type {
	border-bottom: none;	
}
#parties-all ol li:nth-child(even) {
	/*background-color: #EEE; may need this for IE with superselectors*/
	background-color: rgba(0,0,0,0.1);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0.0)), to(rgba(0,0,0,0.15)));
	background-image: -moz-linear-gradient(rgba(0,0,0,0.0) 0%, rgba(0, 0, 0, 0.15) 84%);
}
.locality, .region {
	display: none;
}

/* TABBED PANEL ------------------------ */
.tabs ul {
	padding:10px 10px 0;
	position: relative;
	z-index: 0;
	-o-transform:rotate(-90deg) translate(-10px); 
	-moz-transform:rotate(-90deg) translate(-10px); 
	-webkit-transform:rotate(-90deg) translate(-10px); 
	transform:rotate(-90deg) translate(-10px);
	width: 5.34em; /* width and height should match so that space isn't left at the top */
	height: 5.34em;
}
.no-csstransforms .tabs ul { 
	width: auto;
	height: auto;	
}
.tabs ul li {
	margin:0 0 4px 0; /* creates space between each */
	width: 5.34em; /* this width must match the containing ul */
	background-color: #CCC;
	background: rgba(247,242,235,0.9);
	position: relative;
	z-index: 1;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	-moz-box-shadow: 1px 0 4px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 0 4px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 0 4px rgba(0, 0, 0, 0.5);
}
.no-csstransforms .tabs ul li {
	width: auto;
	float: left;
	background: none;	
}
.tabs ul a {
	display:block;
    padding: 8px 15px 6px 6px;
	text-decoration:none;
	font-weight:bold;
	color:#765;
}
.no-csstransforms .tabs ul a {
	padding: 5px 6px;	
}
.tabs a:hover {
	color:#333;
}
.tabs ul .current {	
	padding-left: 3px;
	background: #FFF;
	position: relative;
	z-index: 100;
}
.no-csstransforms .tabs ul .current {
	padding-left: 0;
}
.tabs ul .current a {
	color:#333;
	padding-bottom:5px;
}
.no-csstransforms .tabs ul .current a {
	padding-bottom: 0;
}
.content {
	position: relative;
	z-index: 2;
	clear: both; /* added for browsers that don't do transforms but doesn't hurt the others */
}
.js .tabs .current-info, .js .tabs .accessibletabsanchor {
	position:absolute;
	top:-999em; /* had to change this because it's going off the BOTTOM due to transform - in FFOX */
}


/* CREDITS */
footer { overflow: auto; }
footer li {
	float: left;
	margin-right: 15px;
}
img { border: none; }