body
{
	font-family:Arial, Helvetica, sans-serif;
	background:url(img/body-bg.png);
}
#fps
{
	position:fixed;
	top:0;
	left:0;
	display:none;
}
button
{
	outline:none;
	cursor:pointer;
	font-family:Arial, Helvetica, sans-serif;
}
button::-moz-focus-inner
{
	border:0;
}
h1
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:35px;
	color:#ffff00;
	text-align:center;
	text-shadow:1px 2px 3px #000;
	/*filter:shadow(color=#000000,direction=45,strength=2);*/
	margin:0;
	padding:15px 0;
}
.share-options
{
	width:780px;
	background:#ffffaa;
	border:solid 1px #333;
	border-radius:10px;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
	border-bottom:0;
	padding:10px;
	margin:10px auto 0 auto;
	min-height:30px;
}
#gameWrapper
{
	width:800px;
	height:470px;
	margin:auto;
	border:solid 5px #94DE00;
	box-shadow:0px 0px 20px #000;
	padding:5px;
	border-radius:15px;
	background:#659700;
	position:relative;
	z-index:2;
	cursor:default;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow:hidden;
}
#start, #levelSelect, #game, #complete, #pause
{
	width:800px;
	height:470px;
}
#start
{
	background:url(img/splash.jpg) no-repeat center center;
	position:relative;
}
	#start .logo
	{
		position:absolute;
		width:300px;
		height:160px;
		background:url(img/main_logo.png) no-repeat center center;
		top:50%;
		margin-top:-80px;
		left:50px;
	}
	#start .buttons
	{
		position:absolute;
		left:50%;
		top:50%;
		right:0;
		text-align:center;
		margin-top:-40px;
	}
	#start .buttons button
	{
		width:250px;
		height:80px;
		font-size:30px;
	}
#levelSelect, #pause
{
	background:url(img/splashbg.jpg) no-repeat center center;
}

button.nice-button
{
	font-size: 20px;
	font-weight:bold;
	color: #000000;
	padding: 10px 20px;
	background: -moz-linear-gradient(
		top,
		#ffff00 0%,
		#ffaa00);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#ffff00),
		to(#ffaa00));
	border-radius: 20px;
	border: 2px solid #ffdd00;
	-moz-box-shadow:
		0px 1px 3px rgba(000,000,000,0.5),
		inset 0px 0px 3px rgba(255,255,255,1);
	-webkit-box-shadow:
		0px 1px 3px rgba(000,000,000,0.5),
		inset 0px 0px 3px rgba(255,255,255,1);
	text-shadow:
		0px -1px 0px rgba(000,000,000,0.1),
		0px 1px 0px rgba(255,255,255,1);
}
button.nice-button:hover
{
	box-shadow:0 0 10px #fff;
	border: 2px solid #ffff00;
}
button.nice-button[disabled]
{
	color:#aaa;
	cursor:default;
	opacity:0.7;
}
button.nice-button[disabled]:hover
{
	border: 2px solid #ffdd00;
	box-shadow:none;
}
#game
{
	position:relative;
}
#inGameTop
{
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:40px;
	background:url(img/top-bg.png) repeat-x 0 -5px;
	z-index:15;
}
#hint
{
	position:absolute;
	left:10px;
	color:#ffff00;
	text-shadow:1px 1px 2px #000;
	font-size:20px;
	font-weight:bold;
	line-height:30px;
}
	#hint label
	{
		color:#fff;
		font-weight:normal;
		padding-right:10px;
	}
#inGameTimer
{
	position:absolute;
	left:50%;
	margin-left:-100px;
	background:url(img/timer_bg.png) no-repeat;
	width:200px;
	height:41px;
	display:table;
}
	#inGameTimer .stars
	{
		display:table-cell;
		vertical-align:middle;
		padding-left:10px;
	}
		#inGameTimer .stars .star1, #inGameTimer .stars .star2, #inGameTimer .stars .star3
		{
			display:inline-block;
			width:26px;
			height:26px;
			background:url(img/score_star_none.png) no-repeat;
			background-size:100% 100%;
		}
		#inGameTimer .stars .star1.active, #inGameTimer .stars .star2.active, #inGameTimer .stars .star3.active
		{
			background:url(img/score_star.png) no-repeat;
			background-size:100% 100%;
		}
	#inGameTimer .timer
	{
		color:#fff;
		font-family:monospace;
		font-size:20px;
		font-weight:bold;
		display:table-cell;
		vertical-align:middle;
		padding-right:15px;
		text-align:right;
		text-shadow:1px 1px 2px #000;
	}
#stage, #stageTop, #loading
{
	margin-top:35px;
	background:#eee;
	position:absolute;
	z-index:2;
}
#stageTop
{
	z-index:1;
}
#loading
{
	z-index:3;
	background:url(img/splashbg.jpg) no-repeat left bottom;
	width:800px;
	height:435px;
}
	#loading h1
	{
		margin-top:100px;
	}
	#loading .busy
	{
	}
	#loading .ready
	{
	}
		#loading .ready .intro, #loading .ready .click
		{
			font-size:35px;
			font-weight:bold;
			text-align:center;
			color:#fff;
			text-shadow:1px 1px 2px #000;
		}
		#loading .ready .intro
		{
			font-size:20px;
		}
	#loading .progress-bar
	{
		width:500px;
		height:35px;
		margin:auto;
		border:solid 3px #000;
		border-radius:10px;
		overflow:hidden;
	}
		#loading .progress-bar .progress
		{
			background: #fceabb; /* Old browsers */
			background: -moz-linear-gradient(top, #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6+ */
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fceabb), color-stop(50%,#fccd4d), color-stop(51%,#f8b500), color-stop(100%,#fbdf93)); /* Chrome,Safari4+ */
			background: -webkit-linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10+,Safari5.1+ */
			background: -o-linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Opera 11.10+ */
			background: -ms-linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* IE10+ */
			background: linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C */

			width:0;
			height:35px;
			-moz-transition-property: width;
			-moz-transition-duration: 0.3s;
			-webkit-transition-property: width;
			-webkit-transition-duration: 0.3s;
		}
		#loading .progress-bar.complete .progress
		{
			width:100%;
		}
#bPause
{
	padding:5px;
	border-radius:10px;
	position:absolute;
	right:5px;
}
#bPause:after
{
	content:"";
	display:block;
	width:40px;
	height:19px;
	background:url(img/pause_icon.png) no-repeat center center;
	padding:0;
}
#pause
{
	position:absolute;
	z-index:15;
	display:none;
}
	#pause h1
	{
		padding-top:120px;
	}
	#pause .buttons
	{
		text-align:center;
		margin-top:25px;
	}
		#pause .buttons button
		{
			padding:15px 25px;
			text-align:center;
			margin:0 10px;
		}
#bResume:after
{
	content:"";
	display:block;
	width:50px;
	height:35px;
	background:url(img/resume_icon.png) no-repeat center center;
	padding:0;
}
#bRestart:after, .button-restart:after
{
	content:"";
	display:block;
	width:50px;
	height:35px;
	background:url(img/replay_icon.png) no-repeat center center;
	padding:0;
}
#bLevels:after, .button-levels:after
{
	content:"";
	display:block;
	width:50px;
	height:35px;
	background:url(img/levels_icon.png) no-repeat center center;
	padding:0;
}
.button-next:after
{
	content:"";
	display:block;
	width:50px;
	height:35px;
	background:url(img/next_icon.png) no-repeat center center;
	padding:0;
}
#levelSelect
{
	position:relative;
}
	#levelSelect .levels-list
	{
		width:660px;
		overflow:hidden;
		margin:auto;
		height:135px;
		background:rgba(101, 151, 0, 0.6);
		border:solid 1px rgba(250, 250, 250, 0.7);
		border-radius:20px;
	}
	#levelSelect ul
	{
		margin:0;
		padding:0;
		list-style:none;
		white-space:nowrap;
		margin-left:220px;
		margin-top:2px;
		-moz-transition-property: margin-left;
		-moz-transition-duration: 0.2s;
		-webkit-transition-property: margin-left;
		-webkit-transition-duration: 0.2s;
		transition-property: margin-left;
		transition-duration: 0.2s;
	}
	#levelSelect li
	{
		display:inline-block;
		margin:0;
		padding:10px;
		min-width:200px;
		min-height:109px;
		position:relative;
		opacity:0.4;
		-moz-transition-property: all;
		-moz-transition-duration: 0.3s;
		-moz-transform:scale(0.7);
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.3s;
		-webkit-transform:scale(0.7);
		transition-property: all;
		transition-duration: 0.3s;
		transform:scale(0.7);
	}
		#levelSelect li img
		{
			display:block;
		}
		#levelSelect li .stars
		{
			position:absolute;
			bottom:7px;
			left:7px;
			right:7px;
			background: #5F8E00; /* Old browsers */
			background: -moz-linear-gradient(top, #5F8E00 0%, #94DE00 100%); /* FF3.6+ */
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5F8E00), color-stop(100%,#94DE00)); /* Chrome,Safari4+ */
			background: -webkit-linear-gradient(top, #5F8E00 0%,#94DE00 100%); /* Chrome10+,Safari5.1+ */
			
			text-align:center;
			display:table-cell;
			vertical-align:middle;
		}
			#levelSelect li .stars .star1, #levelSelect li .stars .star2, #levelSelect li .stars .star3
			{
				display:inline-block;
				width:38px;
				height:35px;
				background:url(img/score_star_none.png) no-repeat;
				background-size:100% 100%;
			}
			#levelSelect li .stars .star1.active, #levelSelect li .stars .star2.active, #levelSelect li .stars .star3.active
			{
				background:url(img/score_star.png) no-repeat;
				background-size:100% 100%;
			}
	#levelSelect .selected
	{
		background:#D5FF2C;
		padding:7px;
		border:solid 3px #659700;
		border-radius:10px;
		opacity:1;
		-moz-transform:scale(1);
		-webkit-transform:scale(1);
		transform:scale(1);
	}
	#levelSelect .locked
	{
		background:url(img/level_locked.png) no-repeat center center;
		padding:10px;
		border:0;
	}
	#levelSelect .level-selection
	{
		position:relative;
		padding-top:20px;
	}
	#levelSelect .nav-prev, #levelSelect .nav-next
	{
		width:50px;
		position:absolute;
		height:100px;
		left:10px;
		top:50%;
		margin-top:-40px;
		text-align:center;
		padding-left:0;
		padding-right:0;
	}
	#levelSelect .nav-prev
	{
		border-radius:50px 4px 4px 50px;
	}
	#levelSelect .nav-next
	{
		left:auto;
		right:10px;
		border-radius:4px 50px 50px 4px;
	}
	#levelSelect .nav-prev:after, #levelSelect .nav-next:after
	{
		content:"";
		display:block;
		height:35px;
		background:url(img/prev_icon.png) no-repeat center center;
	}
	#levelSelect .nav-next:after
	{	
		background:url(img/next_icon.png) no-repeat center center;
	}
	#levelSelect .numbers-mode-selection
	{
		text-align:center;
		margin:10px 0;
	}
		#levelSelect .numbers-mode-selection button
		{
			padding:2px;
			color: #555;
			font-family:Impact, Charcoal, sans-serif;
			font-size:40px;
			/*width:100px;
			height:100px;*/
			border:solid 3px #555;
			background:#dfff00;
			border-radius: 60px;
			line-height:108px;
			text-shadow:0px -2px 2px rgba(000,000,000,0.1), 0px 1px 2px rgba(255,255,255,1);
			opacity:0.7;
			-moz-transform:scale(0.9);
			-webkit-transform:scale(0.9);
			transform:scale(0.9);
			
			-moz-transition-property: all;
			-moz-transition-duration: 0.2s;
			-webkit-transition-property: all;
			-webkit-transition-duration: 0.2s;
		}
		#levelSelect .numbers-mode-selection button.selected
		{
			color: #000;
			box-shadow:0px 0px 10px #000;
			opacity:1;
			-moz-transform:scale(1);
			-webkit-transform:scale(1);
			transform:scale(1);
			border:solid 3px #000;
		}
		#levelSelect .numbers-mode-selection button span
		{
			display:block;
			width:110px;
			height:110px;
			border-radius:55px;
			background:#C7EF23;
		}
		#levelSelect .numbers-mode-selection button.selected span
		{
			background-image: -webkit-gradient(radial, 5% 5%, 20, 5% 5%, 65, from(#F0FFB2), to(#C7EF23));
			background: -moz-radial-gradient(
			  5% 5%, circle, #F0FFB2 20px, #C7EF23 65px
			);
		}
	#levelSelect .difficulty-selection
	{
		text-align:center;
	}
		#levelSelect .difficulty-selection button
		{
			padding:10px 30px;
			font-size:25px;
			color:#ffa;
			border-radius: 20px;
			font-weight:bold;
			border: 3px solid #315911;
			background:#79B509;
			opacity:0.7;
			-moz-transform:scale(0.9);
			-webkit-transform:scale(0.9);
			transform:scale(0.9);
			
			-moz-transition-property: all;
			-moz-transition-duration: 0.2s;
			-webkit-transition-property: all;
			-webkit-transition-duration: 0.2s;
		}
		#levelSelect .difficulty-selection button.selected
		{
			opacity:1;
			color:#ff0;
			box-shadow:0px 0px 5px rgba(0,0,0,0.5);
			text-shadow:0px -2px 2px rgba(255,255,255,0.1), 0px 1px 2px rgba(0,0,0,1);
			-moz-transform:scale(1);
			-webkit-transform:scale(1);
			transform:scale(1);
			background: -moz-linear-gradient(
				top,
				#79B509 0%,
				#609007);
			background: -webkit-gradient(
				linear, left top, left bottom, 
				from(#79B509),
				to(#609007));
		}
	#levelSelect .buttons
	{
		text-align:center;
		position:relative;
		margin:20px 0;
	}
		#bStart
		{
			font-size:35px;
			font-weight:bold;
			padding:10px 60px;
		}
		#bPractice, #bBack
		{
			position:absolute;
			right:20px;
			top:50%;
			margin-top:-20px;
			border-radius:10px;
		}
		#bBack
		{
			left:20px;
			right:auto;
			padding:6px;
		}
		#bBack:after
		{
			content:"";
			display:block;
			width:50px;
			height:35px;
			background:url(img/prev_icon.png) no-repeat center center;
		}
#gameComplete, #gameFailed
{
	position:absolute;
	left:0;
	top:35px;
	right:0;
	bottom:0;
	background:rgba(20,20,20,0.5);
	z-index:10;
	display:none;
}
	#gameComplete .dialog, #gameFailed .dialog
	{
		width:400px;
		min-height:235px;
		margin:auto;
		position:absolute;
		border-radius:15px;
		border:solid 3px #fff;
		box-shadow:0 0 10px #000;
		left:50%;
		margin-left:-200px;
		top:50%;
		margin-top:-200px;
		padding-bottom:80px;
		background: #5F8E00; /* Old browsers */
		background: -moz-linear-gradient(top, #5F8E00 0%, #94DE00 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5F8E00), color-stop(100%,#94DE00)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #5F8E00 0%,#94DE00 100%); /* Chrome10+,Safari5.1+ */
		
		
		-moz-transition-property: all;
		-moz-transition-duration: 0.6s;
		-webkit-transition-property: all;
		-webkit-transition-duration: 0.6s;
		
		-moz-transform:scale(0);
		-webkit-transform:scale(0);
	}
	#gameComplete .dialog.visible, #gameFailed .dialog.visible
	{
		-moz-transform:scale(1);
		-webkit-transform:scale(1);
	}
		#gameFailed .dialog .sad
		{
			width:150px;
			height:150px;
			background:url(img/failed.png) center center no-repeat;
			margin:auto;
		}
	#gameComplete .stars
	{
		vertical-align:middle;
		padding-left:10px;
		text-align:center;
	}
		#gameComplete .stars .star1, #gameComplete .stars .star2, #gameComplete .stars .star3
		{
			display:inline-block;
			width:83px;
			height:76px;
			background:url(img/score_star_none.png) no-repeat;
			background-size:100% 100%;
			-webkit-transition-property: all;
			-webkit-transition-duration: 1s;
		}
		#gameComplete .stars .star1 span, #gameComplete .stars .star2 span, #gameComplete .stars .star3 span
		{
			content:"";
			background:url(img/score_star.png) no-repeat;
			display:block;
			width:83px;
			height:76px;
			-moz-transform:scale(3) rotate(180deg);
			-webkit-transform:scale(3) rotate(180deg);
			-moz-transition-property: all;
			-moz-transition-duration: 1s;
			-webkit-transition-property: all;
			-webkit-transition-duration: 1s;
			opacity:0;
		}
		#gameComplete .stars .active span
		{
			-moz-transform:scale(1) rotate(0deg);
			-webkit-transform:scale(1) rotate(0deg);
			opacity:1;
		}
	#gameComplete .time-info, #gameFailed .time-info
	{
		text-align:center;
		margin:10px 0;
	}
		#gameComplete .time-info label, #gameFailed .time-info label
		{
			color:#ffff00;
			font-size:30px;
			text-shadow:1px 1px 2px #000;
		}
		#gameComplete .new-best
		{
			display:inline-block;
			width:100px;
			height:100px;
			background:url(img/new_best_time.png) no-repeat;
			line-height:120px;
			vertical-align:middle;
			margin-right:15px;
			display:inline-block;
			opacity:0;
			-moz-transform:scale(0);
			-webkit-transform:scale(0);
			-moz-transition-property: all;
			-moz-transition-duration: 0.5s;
			-webkit-transition-property: all;
			-webkit-transition-duration: 0.5s;
		}
		#gameComplete .new-best.active
		{
			-moz-transform:scale(1);
			-webkit-transform:scale(1);
			opacity:1;
		}
		#gameComplete .time-info .time, #gameFailed .time-info .time
		{
			color:#fff;
			font-size:45px;
			font-family:monospace;
			font-weight:bold;
			text-shadow:1px 1px 2px #000;
			display:inline-block;
			line-height:120px;
			vertical-align:middle;
		}
	#gameComplete .share, #gameFailed .share
	{
		text-align:center;
		margin:5px 0 15px 0;
		display:none;
	}
	#gameComplete .buttons, #gameFailed .buttons
	{
		position:absolute;
		bottom:0;
		left:0;
		right:0;
		padding:10px;
		border-radius: 0 0 14px 14px;
		border-top:solid 1px #000;
		text-align:center;
		background: #7d7e7d; /* Old browsers */
		background: -moz-linear-gradient(top, rgba(100,100,100,0.5) 0%, rgba(10,10,10,0.5) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(100,100,100,0.5)), color-stop(100%,rgba(10,10,10,0.5))); /* Chrome,Safari4+ */
	}
		#gameComplete .buttons button, #gameFailed .buttons button
		{
			margin:0 5px;
		}
#promo
{
	width:800px;
	margin:auto;
	display:table;
	position:relative;
	z-index:1;
	background:#ffffaa;
	border:solid 1px #333;
	border-radius:10px;
	border-top-left-radius:0;
	border-top-right-radius:0;
	border-top:0;
}
	#promo .description, #promo .market
	{
		padding:10px;
	}
	#promo .description
	{
		width:600px;
		display:table-cell;
		font-family:Tahoma, Geneva, sans-serif;
		font-size:13px;
		line-height:20px;
	}
	#promo .market
	{
		display:table-cell;
		text-align:center;
	}
		#promo .market a
		{
			background:url(img/get_it_on_play_logo_large.png) no-repeat;
			display:block;
			width:172px;
			height:60px;
			text-decoration:none;
		}
#start, #levelSelect, #game
{
	position:absolute;
	top:5px;
	/*top:-470px;*/
	-moz-transform:scale(0);
	-webkit-transform:scale(0);
	opacity:0;
	
	-moz-transition-property: all;
	-moz-transition-duration: 0.4s;
	-webkit-transition-property: all;
	-webkit-transition-duration: 0.4s;
}
#start.activity, #levelSelect.activity, #game.activity
{
	top:5px;
	-moz-transform:scale(1);
	-webkit-transform:scale(1);
	opacity:1;
}
#start.stacked, #levelSelect.stacked, #game.stacked
{
	/*top:480px;*/
	-moz-transform:scale(0);
	-webkit-transform:scale(0);
}
#google
{
	width:730px;
	margin:auto;
}
#altContent
{
	width:760px;
	padding:20px;
	margin:auto;
	border:solid 2px #D1FF44;
	background:#5F8E00;
	font-size:24px;
	color:#ffff00;
	text-align:center;
	display:none;
}

/* dark theme */
/*
#gameWrapper
{
	border:solid 5px #777;
	background:#333;
}
#levelSelect .levels-list
{
	background:rgba(10,10,10,0.3);
}
#levelSelect .selected
{
	border-color:#000;
	background:#aaa;
}
#levelSelect li .stars
{
	background: -moz-linear-gradient(top, #000000 0%, #777 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5F8E00), color-stop(100%,#94DE00));
	background: -webkit-linear-gradient(top, #5F8E00 0%,#94DE00 100%);
}
#levelSelect .numbers-mode-selection button
{
	color:#aaa;
	background:#aaa;
	text-shadow:none;
}
#levelSelect .numbers-mode-selection button.selected
{
	color:#ff0;
	background:#fff;
}
#levelSelect .numbers-mode-selection button span
{
	background:#333;
}
#levelSelect .numbers-mode-selection button.selected span
{
	background-image: -webkit-gradient(radial, 5% 5%, 20, 5% 5%, 65, from(#aaaaaa), to(#000000));
	background: -moz-radial-gradient(
			  5% 5%, circle, #aaa 20px, #000 65px
			);
}

#levelSelect .difficulty-selection button
{
	background:#333;
	border-color:#aaa;
	color:#aaa;
}
#levelSelect .difficulty-selection button.selected
{
	border-color:#fff;
	background: -moz-linear-gradient(
		top,
		#777 0%,
		#333);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#79B509),
		to(#609007));
}
*/