html
{
	background-image: url("Nebel.jpg");
	background-attachment: scroll;
	text-align: center;
}
html body 
{
	margin: 0;
	border: 0;
	padding: 0;
	overflow: hidden;	
}
html head 
{
	margin: 0;
	border: 0;
	padding: 0;
}
h1
{
	text-align: center;
	color:#FFFFFF;
	font-size: 2em;
	line-height: 2em;
}
#table1
{
    	position:fixed;
    	top:30%;
    	left:20%;
}
#table2
{
    	position:fixed;
    	top:30%;
    	left:50%;
}
#clickme
{
	position: relative; top: 35px;
	color: #fff;
	text-shadow: 0px -1px 4px white, 0px -2px 10px yellow, 0px -10px 20px #ff8000, 0px -18px 40px red;
	font: 20px 'MisoRegular';
	font-weight:bold;
	
}

button 
{
	-moz-box-shadow:inset 0px 0px 0px -50px #97c4fe;
	-webkit-box-shadow:inset 0px 0px 0px -50px #97c4fe;
	box-shadow:inset 0px 0px 0px -50px #97c4fe;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #3d94f6), color-stop(1, #1e62d0) );
	background:-moz-linear-gradient( center top, #3d94f6 5%, #1e62d0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0');
	-webkit-border-top-left-radius:20px;
	-moz-border-radius-topleft:20px;
	border-top-left-radius:20px;
	-webkit-border-top-right-radius:20px;
	-moz-border-radius-topright:20px;
	border-top-right-radius:20px;
	-webkit-border-bottom-right-radius:20px;
	-moz-border-radius-bottomright:20px;
	border-bottom-right-radius:20px;
	-webkit-border-bottom-left-radius:20px;
	-moz-border-radius-bottomleft:20px;
	border-bottom-left-radius:20px;
	text-indent:0px;
	border:1px solid #337fed;
	display:inline-block;
	color:#FFFFFF;
	font-family:Georgia;
	font-size:20px;
	font-weight:bold;
	font-style:normal;
	height:30pt;
	line-height:0pt;
	width:190pt;
	text-decoration:none;
	text-align:center;
	text-shadow:2px 2px 0px #000000;
	box-shadow: 5px 5px 3px #000000;
	background:  url("rubiks-cube-2.jpg");
}
button:hover 
{
	background:  url("");
	color:#000000;
	text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #01E2FF, 0 0 30px #01E2FF, 0 0 40px #01E2FF, 0 0 50px #01E2FF, 0 0 75px #01E2FF;
	font: 'MisoRegular';
}
button:active 
{
	position:relative;
	top:1px;
}
button
{
	color: #fff;
	text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #01E2FF, 0 0 30px #01E2FF, 0 0 40px #01E2FF, 0 0 50px #01E2FF, 0 0 75px #01E2FF;
	font: 'MisoRegular';
}
i 
{
	display: inline-block;
	font-style: normal;
	padding: 0 0.25em;
	-webkit-transform: scale(1) translate3d(0, -2000px, 0);
	-moz-transform: scale(1) translate3d(0, -2000px, 0);
	-ms-transform: scale(1) translate3d(0, -2000px, 0);
	-o-transform: scale(1) translate3d(0, -2000px, 0);
	transform: scale(1) translate3d(0, -2000px, 0);
	border-radius: 50%;
	color: rgba(255, 255, 255, 0.8);
	text-shadow: 0px -1px 4px #F00, 0px -2px 10px #F00, 0px -10px 20px #F00, 0px -18px 40px #F00;
	background: transparent;
	box-shadow: none;
}
i.fly-in-out 
{
	-webkit-animation: fly-in-out 5s 1 ease-in-out;
	-moz-animation: fly-in-out 5s 1 ease-in-out;
	-o-animation: fly-in-out 5s 1 ease-in-out;
	animation: fly-in-out 5s 1 ease-in-out;
}
@-webkit-keyframes fly-in-out 
{
	0% 
	{
		-webkit-transform: scale(0) translate3d(0, -1000px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}
	15%, 85% 
	{
		color: rgba(255, 255, 255, 0.8);
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
		-webkit-transform: scale(1) translate3d(0, 0, 0);
		background: transparent;
		box-shadow: none;
	}
	/*100% 
	{
		color: transparent;	
		-webkit-transform: scale(0) translate3d(0, 0px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}*/
}
@-moz-keyframes fly-in-out 
{
	0% 
	{
		-moz-transform: scale(0) translate3d(0, -2000px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}
	15%, 85% 
	{
		color: rgba(255, 255, 255, 0.8);
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
		-moz-transform: scale(1) translate3d(0, 0, 0);
		background: transparent;
		box-shadow: none;
	}
	/*100% 
	{
		color: transparent;	
		-moz-transform: scale(0) translate3d(0, 0px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}*/
}
@-o-keyframes fly-in-out 
{
	0% 
	{
		-o-transform: scale(0) translate3d(0, -2000px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}
	15%, 85% 
	{
		color: rgba(255, 255, 255, 0.8);
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
		-o-transform: scale(1) translate3d(0, 0, 0);
		background: transparent;
		box-shadow: none;
	}
	/*100% 
	{
		color: transparent;	
		-o-transform: scale(0) translate3d(0, 0px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}*/
}
@keyframes fly-in-out 
{
	0% 
	{
		transform: scale(0) translate3d(0, -2000px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}
	15%, 85% 
	{
		color: rgba(255, 255, 255, 0.8);
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
		transform: scale(1) translate3d(0, 0, 0);
		background: transparent;
		box-shadow: none;
	}
	/*100% 
	{
		color: transparent;	
		transform: scale(0) translate3d(0, 0px, 0);
		background: rgba(255, 255, 255, 0.3);
		box-shadow: 0 0 100px 100px rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		text-shadow: 0px -1px 4px #0F0, 0px -2px 10px #0F0, 0px -10px 20px #0F0, 0px -18px 40px #0F0;
	}*/
}
