@charset "utf-8";

/* Reset CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 displays */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
html {height:100%;}
body {
	line-height: 1;
	background:rgb(0,0,0);
	width:100%;
	height:100%;
	text-align:center;
	color:white;
	font: 400 0.8em/1.3 'Open Sans', 'Helvetica-Neue', 'Helvetica', 'Arial', sans-serif;
	-webkit-font-smoothing:antialiased;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
@import url(http://fonts.googleapis.com/css?family=Gentium+Book+Basic);


@media all {
/* !Globals */
/*-------------------------------------------------*/
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.rel { position: relative; }
.abs { position: absolute; }
.block { display: block; }
.inline {display:inline-block;}
.zoom { overflow:hidden; zoom:1; }
.strong { font-weight: bold; }
.uline { text-decoration: underline; }
.italic { font-style:italic; }
.none { display:none; }
.no-un { text-decoration: none; }
.tleft { text-align: left; }
.tright { text-align:right; }
.tcenter { text-align: center; }
.abs.centered {top:50%;left:50%;position:absolute;}
.half {width:50%;}
.forty {width:40%;}
.sixty {width:60%;}
.full {width:100%;}

h1, h2, h3, h4 {font-family: 'Gentium Book Basic', serif;}

/*div {border: 1px solid rgba(255,255,255,0.6)}*/

html {height:100%;}
body {overflow:hidden;color:rgb(248,245,235);height:100%;}


p {color:rgb(248,245,235);
	text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-webkit-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-moz-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-ms-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-o-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);}
a {color:rgb(248,245,235);}


#dinnertable {width:100%;height:100%;position:relative;overflow:hidden;z-index:100;top:0;left:0;background:none;
				-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
#globalmask {position:absolute;top:0;left:0;width:100%;height:100%;z-index:2000;background:rgba(0,0,0,0.65);}
#intromask {position:absolute;top:0;left:0;width:100%;height:100%;z-index:2000;background:rgb(0,0,0);}

.top-right {top:15px;right:15px;position:absolute;z-index:6000;}
	.controls {display:none;float:left;margin-right:3px;background:rgba(0,0,0,1);
			border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px;-o-border-radius:2px;-ms-border-radius:2px;}
			#wtf {background-position: 1px 0;}
			#pause {background-position: -68px 2px;}
			#voltoggle {background-position: -37px 0;}
			#voltoggle.muted {background-position:-80px 0;}
			#playintro {background-position:-15px 0;}
			#replay.btn {background-position:-58px 0;display:none;}
			#skip-intro {position:absolute;float:none!important;width:135px;bottom:25px;left:50%;background:none;line-height:20px;font-size:1.3em;margin-left:-67px;font-style:italic;display:none;}
			.slider-wrap {opacity:0;height:100px;width:31px;top:10px;position:absolute;display:none;
					-webkit-transition: opacity .4s linear;-moz-transition: opacity .4s linear;-o-transition: opacity .4s linear;transition: opacity .4s linear;}
				#slider {height:100px;opacity:0.7;z-index:2999px;top:20px;left:50%;margin-left:-10px;position:absolute;} #slider > a {z-index:3000;}
			#voltoggle:hover .slider-wrap {opacity:1;display:block;}

			.btn {border:none;opacity:0.6;background-image:url('/img/icons.png');background-repeat:no-repeat;color:rgb(255,255,255);height:20px;width:20px;cursor:pointer;
			-webkit-transition: opacity .3s ease-in-out;-moz-transition: opacity .3s ease-in-out;-o-transition: opacity .3s ease-in-out;transition: opacity .3s ease-in-out;}
			.btn:hover {opacity:1;}

.share {position:absolute;top:15px;left:15px;z-index:5000;}
	.share > div {float:left;margin-left:5px;opacity:0.6;
	-webkit-transition: opacity .3s;-moz-transition: opacity .3s; -o-transition: opacity .3s; -ms-transition: opacity .3s;	transition:opacity .3s;}
	.share > div:hover {opacity:1;}
	.fb-wrapper {overflow:hidden;width:50px;} .tweet-wrapper {overflow:hidden;width:58px;}
	#share-thank {display:inline-block;}

.fsv {top:0;left:0;min-width:100%;background:none;margin:0 auto;position:absolute;min-height:100%!important;}

#test {position:absolute;bottom:0;left:0;padding:10px;background:rgba(0,0,0,0.5);color:rgb(255,255,255);width:100%;z-index:100;display:none;}
#test li {line-height:2;display:inline-block;min-width:100px;}
#test li span {margin-left:20px;}

#loader {z-index:3000;position:relative;width:347px;height:300px;}
	#cornucopia {width:347px;height:238px;background: url('/img/cornucopia.png') center top no-repeat;position:absolute;z-index:3002;top:0;left:0;
		-webkit-animation: fadeIn 1s; -moz-animation: fadeIn 1s; -o-animation: fadeIn 1s; -ms-animation: fadeIn 1s;animation: fadeIn 1s;}
	#vortex {position:absolute;z-index:3001;top:31px;left:81px;
		-webkit-transform: scale(0.6);-moz-transform: scale(0.6);-o-transform: scale(0.6);-ms-transform: scale(0.6);transform: scale(0.6);}
	.load-title {position:absolute;bottom:100px;width:100%;text-align:center;z-index:3002;} .load-title h2 {font-size:1.2em;}

video {z-index:0;}
.active {z-index:5!important;}
.overlay {z-index:2001;}

#welcome, #congrats, #wtfpage, #error {max-width:500px;width:40%;max-height:600px;height:70%;background:none;text-align:center;}
	#welcome .copy {min-height:252px;}
	#congrats {top:auto;bottom:30px;height:400px;}
	#welcome .copy, #congrats .copy, #wtfpage .copy, #error .copy {text-align:center;width:65%;margin:0 auto;max-height:50%;min-width:350px;
		-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
	#wtfpage {max-width:560px;width:42%;}
	#wtfpage .copy {width:100%!important;}
	#welcome .copy p, #congrats .copy p, #wtfpage .copy p, #error .copy p {font-size:1.5em;line-height:1.5;font-style:italic;height:100%;margin:0 auto;
				-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
	#welcome .copy .line {display:none;}
	.thanksgiver {max-width:456px;width:100%;display:block;margin:0 auto 25px auto;}
	.thanksgiver.con {margin:0 auto 12px auto!important;}
	.thanksgiver img {width:100%;height:auto;}
	#welcome-thanksgiver {}
	.border-top {height:30px;width:62%;max-width:283px;display:block;background:url('/img/border-top.png') center top no-repeat;margin: 0 auto 15px auto;}
	.border-top-2 {height:20px;width:62%;max-width:395px;display:block;background:url('/img/border-top-2.png') center top no-repeat;margin: 0 auto 15px auto;}
	.border-bottom {height:22px;width:62%;max-width:283px;display:block;background:url('/img/border-bottom.png') center top no-repeat;margin: 25px auto 15px auto;}	
	.border-bottom-2 {height:22px;width:62%;max-width:395px;display:block;background:url('/img/border-bottom-2.png') center top no-repeat;margin: 25px auto 15px auto;}
	
	#error {width:700px;display:none;}
	#error .copy {width:100%;max-width:100%;padding-bottom:15px;}
	#error .copy p {font-size:1.2em;}
	
#prompt {width:440px;height:55px;bottom:40px!important;margin-top:0!important;top:auto;z-index:2001;}
#titler-holder {position:absolute;bottom:104px;display:block;text-align:center;width:100%;z-index:2001;
				-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
	h3#titler {color:rgb(243,233,215);text-transform:uppercase;font-size:2.5em;letter-spacing:0;display:none;text-align:center;
				text-shadow: 1px 1px 2px rgba(0,0,0,0.8);-webkit-text-shadow: 1px 1px 2px rgba(0,0,0,0.8);-moz-text-shadow: 1px 1px 2px rgba(0,0,0,0.8);-ms-text-shadow: 1px 1px 2px rgba(0,0,0,0.8);-o-text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
				-webkit-transition: all 5s linear;-moz-transition: all 5s linear;-o-transition: all 5s linear;-ms-transition: all 5s linear;transition: all 5s linear;}
		.brownbtn {display:inline-block;cursor:pointer; padding:13px 15px; background-color:rgba(30,28,0,0.95);font-size:1.3em;font-weight:bold;font-style:italic;
					text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-webkit-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-moz-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-ms-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);-o-text-shadow: -1px -1px 0 rgba(0,0,0,0.7);
					border-radius:6px;-webkit-border-radius: 6px;-moz-border-radius:6px;-o-border-radius:6px;-ms-border-radius:6px;
					-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;transition: all .3s ease-in-out;
					-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
		.brownbtn:hover {background-color:rgba(30,28,0,1);
						-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-o-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);
						-webkit-box-shadow:0 0 11px 6px rgba(248, 245, 235, 0.2);-moz-box-shadow:0 0 11px 6px rgba(248, 245, 235, 0.2);-o-box-shadow:0 0 11px 6px rgba(248, 245, 235, 0.2);-ms-box-shadow:0 0 11px 6px rgba(248, 245, 235, 0.2);box-shadow:0 0 11px 6px rgba(248, 245, 235, 0.2);}
		.sharebtn {background: url('/img/fb.png') center top no-repeat;width:18px;height:19px;display:inline-block;position:relative;}
		.fb.sharebtn {background-position: 0 0;vertical-align: middle;margin-top: -2px;}
		.twitter.sharebtn {background-position:-16px 0;}
		/*.sharebtn:hover:after {display:block;padding:5px 7px;width:200px;content: attr(data-tooltip);z-index:6000;position:absolute;top:-30px;left:auto;font-size:0.7em;background:rgba(243,233,215,0.7);color:rgb(30,28,0);
			border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px;-o-border-radius:2px;-ms-border-radius:2px;}*/

#start-holder {display:none;
				-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}
#start, #honeybadger {font: italic 1.7em/2 'Gentium Book Basic', serif;text-decoration:none;color:white;}
	.arrow {vertical-align:middle;width:17px;height:5px;display:inline-block;margin: -2px 0 0 0;
			-webkit-animation: arrows 1s;-moz-animation: arrows 1s;-o-animation: arrows 1s;animation: arrows 1s;
			-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite;-o-animation-iteration-count:infinite;animation-iteration-count:infinite;
			}
	.left-arrow {background:url('/img/arrow-left.png') center top no-repeat;}
	.right-arrow {background:url('/img/arrow-right.png') center top no-repeat;}
#info {display:none;}
#info > span {display:none;}

/* !Animations */
/*-------------------------------------------------*/
@-moz-keyframes arrows {
	0% {padding: 0 5px 0 5px;}
	50% {padding: 0 15px 0 15px;}
	100% {padding: 0 5px 0 5px;}
}
@-webkit-keyframes arrows {
	0% {padding: 0 5px 0 5px;}
	50% {padding: 0 15px 0 15px;}
	100% {padding: 0 5px 0 5px;}
}
@-o-keyframes arrows {
	0% {padding: 0 5px 0 5px;}
	50% {padding: 0 15px 0 15px;}
	100% {padding: 0 5px 0 5px;}
}
@-ms-keyframes arrows {
	0% {padding: 0 5px 0 5px;}
	50% {padding: 0 15px 0 15px;}
	100% {padding: 0 5px 0 5px;}
}
@keyframes arrows {
	0% {padding: 0 5px 0 5px;}
	50% {padding: 0 15px 0 15px;}
	100% {padding: 0 5px 0 5px;}
}
@-webkit-keyframes intro {
	0% {-webkit-transform: scale(0);}
	50% {-webkit-transform: scale(1.3);}
	100% {-webkit-transform: scale(1);}
}
@-moz-keyframes intro {
	0% {-moz-transform: scale(0);}
	50% {-moz-transform: scale(1.3);}
	100% {-moz-transform: scale(1);}
}
@-o-keyframes intro {
	0% {-o-transform: scale(0);}
	50% {-o-transform: scale(1.3);}
	100% {-o-transform: scale(1);}
}
@-ms-keyframes intro {
	0% {transform: scale(0);}
	50% {transform: scale(1.3);}
	100% {transform: scale(1);}
}
@keyframes intro {
	0% {transform: scale(0);}
	50% {transform: scale(1.3);}
	100% {transform: scale(1);}
}

@-webkit-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-moz-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-o-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-ms-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
}
@media screen and (min-width:300px) and (max-width:1024px) {
	.copy p {font-size:100%!important;width:100%!important;}
	.copy {width:80%!important;}
	#welcome .copy, #error .copy {width:70%;height:auto;max-height:100%!important;} #welcome .copy p, #error .copy p {height:auto;max-height:70%!important;}
	.none.overlay {width:70%!important;}
}