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

body{
	background:#222;
	color:#666;
	font-family:"Tahoma", Geneva, sans-serif;
	-webkit-transition: background 0.15s linear;
	-moz-transition: background 0.15s linear;
}
a{
	color:#444;
}
img{
	margin: .2em; 
	transition: opacity .1s ease-in-out;
	-moz-transition: opacity .1s ease-in-out;
	-webkit-transition: opacity .1s ease-in-out;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
}
.item{
	opacity:.8;
}
.item:hover{
	opacity:1;
}
#instructions{
	position:fixed;
	top:1em;
	left:50%;
	font-size:1.4em;
	background:#111;
	border:.05em solid #000;
	width:22em;
	margin-left:-11em;
	padding-bottom:.2em;
	-moz-border-radius: .5em;
	-webkit-border-radius: .5em;
	transition: opacity .75s;
	-moz-transition: opacity .75s;
	-webkit-transition: opacity .75s;
}
#controls{
	position:fixed;
	border:.05em solid #111;
	bottom:7%;
	left:50%;
	width:8em;
	margin-left:-4em;
	z-index:1;
	font-size:4em;
	background: #111;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
	-moz-box-shadow: .2em .2em .6em #000;
	-webkit-box-shadow: .2em .2em .6em #000;
	opacity: 1;
	transition: opacity .75s;
	-moz-transition: opacity .75s;
	-webkit-transition: opacity .75s;
	cursor: pointer;
}
#disclaimer{
	position:fixed;
	right:.2em;
	bottom:.4em;
	background: #111;
	opacity:.6;
	width:35em;
	-moz-box-shadow: .2em .2em .6em #000;
	-webkit-box-shadow: .2em .2em .6em #000;
	padding-bottom:.2em;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
	transition: opacity .2s;
	-moz-transition: opacity .2s;
	-webkit-transition: opacity .2s;
	z-index:1;
}
#disclaimer:hover{
	opacity: 1;
}
#privacy{
	position:fixed;
	left:.2em;
	bottom:.4em;
	background: #111;
	opacity:.6;
	width:12em;
	-moz-box-shadow: .2em .2em .6em #000;
	-webkit-box-shadow: .2em .2em .6em #000;
	padding-bottom:.2em;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
	transition: opacity .2s;
	-moz-transition: opacity .2s;
	-webkit-transition: opacity .2s;
	z-index:1;
}
#privacy:hover{
	opacity: 1;
}
#size{
	font-size:1.5em;
	position:fixed;
	border:.05em solid #111;
	bottom: .4em;
	left:50%;
	width: 16em;
	margin-left:-8em;
	padding-bottom:.2em;
	background: #111;
	opacity: .6;
	z-index:1;
	-moz-box-shadow: .2em .2em .6em #000;
	-webkit-box-shadow: .2em .2em .6em #000;
	-moz-border-radius: .2em;
	-webkit-border-radius: .2em;
	transition: opacity .2s;
	-moz-transition: opacity .2s;
	-webkit-transition: opacity .2s;
}
#size:hover{
	opacity: 1;
}

/*mobile hack*/
@media screen and (orientation:portrait)
{
   #disclaimer
   {
    right:auto;
	bottom:auto;
	left:50%;
	top:.4em;
	margin-left:-10em;
	width:20em;
	font-size:2em;
	opacity:1;
   }
   #controls
   {
   font-size:6em;
   bottom:.5em;
   }
   #instructions
   {
	display:none;
   }
   #privacy
   {
   display:none;
   }
   #size
   {
   font-size:2em;
   }
   img
   {
   width:28em;
   }
   #size
   {
   opacity:0;
   }
   #size:hover
   {
   opacity:0;
   }
}