@font-face {
	font-family: 'subset-Cheltenham-BoldCond.woff';
	src: url('subset-Cheltenham-BoldCond.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/** COMMON SETUP */
#banner
{
	position: relative;
	background: #000 url("bg.jpg") no-repeat 50% 50%;
	background-size: cover;
	color: #FFF;
	width: 930px;
	height: 180px;
	overflow: hidden;
	font-family: 'subset-Cheltenham-BoldCond.woff';
	font-weight: normal;
	font-style: normal;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
*,
*:before,
*:after
{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
#banner img
{
	display: inline-block;
	border: none;
	vertical-align: top;
	-ms-interpolation-mode: bicubic;
}

#non-game-items
{
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 222;
	pointer-events: none;
}
#non-game-items.js-hidden
{
	display: none;
}

/** LOGO */
.logo-bar,
.logo
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 777;
	pointer-events: none;
}
.logo-bar
{
	width: 100%;
}
.logo
{
	z-index: 888;
}
.logo-bar img,
.logo img
{
	width: 100%;
	height: auto;
}

#logo-big
{
	z-index: 888;
	/*top: 59px;
	left: 40px;
	width: 120px;*/
	top: 59px;
	left: 120px;
	width: 96px;
	
}
#logo-big.waiting
{
	opacity: 0;
	-webkit-transform: translate3d(0,20px,0) scale(1);
	transform: translate3d(0,20px,0) scale(1);

	-webkit-transition: opacity .3s ease-out,-webkit-transform .3s ease-out;
	transition: opacity .3s ease-out,transform .3s ease-out;
}
#logo-big.in
{
	-webkit-transition: opacity .3s ease-out,-webkit-transform .3s ease-out;
	transition: opacity .3s ease-out,transform .3s ease-out;

	opacity: 1;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}
#logo-big.out
{
	visibility: hidden;

	-webkit-transition: -webkit-transform .4s ease-out, visibility .01s linear .4s;
	transition: transform .4s ease-out, visibility .01s linear .4s;

	opacity: 1;
	-webkit-transform: translate3d(-41px,-63px,0) scale(.83333);
	transform: translate3d(-108px,-55px,0) scale(.83333);
}
#logo
{
	top: 9px;
	left: 19px;
	width: 80px;
}
#logo.waiting
{
	-webkit-transition: none !important;
	transition: none !important;

	opacity: 0;
}
#logo.out
{
	-webkit-transition: opacity .3s ease-out;
	transition: opacity .3s ease-out;
	opacity: 0;
}
#logo.in
{
	-webkit-transition: opacity .01s linear .4s;
	transition: opacity .01s linear .4s;

	opacity: 1;
}

/** COPY */
.copy
{
	position: absolute;
	top: 20px;
	left: 0;
	z-index: 444;
	width: 100%;
	text-align: center;
	line-height: 1.5em;
	-webkit-transition: -webkit-transform .3s ease-out, opacity .3s ease-out;
	transition: transform .3s ease-out, opacity .3s ease-out;
}
.copy.in
{
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.copy.out
{
	opacity: 0;
	-webkit-transform: translate3d(0,10px,0);
	transform: translate3d(0,10px,0);
}
.copy.waiting
{
	opacity: 0;
	-webkit-transform: translate3d(0,-10px,0);
	transform: translate3d(0,-10px,0);
	-webkit-transition: none !important;
	transition: none !important;
}
#copy1a
{
	top: 12px;
	font-size: 40px;
}
#copy1b
{
	top: 61px;
	font-size: 20px;
}
#copy2a
{
	top: 18px;
	font-size: 42px;
}
#copy2b
{
	top: 69px;
	font-size: 22px;
}

#result
{
	top: 96px;
	font-size: 18px;
}

/** PIZZA SHUFFLER */
#pizza-shuffler
{
	position: absolute;
	top: 23px;
	right: 52px;
	z-index: 111;
	width: 140px;
	opacity: 0;

	-webkit-transition: opacity .3s ease-out;
	transition: opacity .3s ease-out;
}
#pizza-shuffler.js-revealed
{
	opacity: 1;
}

#pizza-shuffler img
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 111;
	opacity: 0;

	-webkit-transition: opacity .5s ease-out;
	transition: opacity .5s ease-out;

	width: 100%;
	height: auto;
}
#pizza-shuffler img.js-revealed
{
	opacity: 1;
	z-index: 333;
}
#pizza-shuffler img.js-concealed
{
	opacity: 0;
	z-index: 222;

	-webkit-transition-delay: .5s;
	transition-delay: .5s;
}