html, body {
	padding: 0;
	margin: 0 auto;
	background: #000000;
	text-align: center;
/*	width: 100%;
	height: 100%;*/
	overflow-x: hidden;
	overflow-y: hidden;
}

canvas {
	width: 100%;
	height: 100%;
}

/*********************************************************
*** Interactions
*********************************************************/
div#interactions {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1000;
	overflow: hidden;
}

div#interactions div.bubble {
	position: absolute;
}

div#interactions div.bubble img {
	width: 221px;
	height: 179px;
}

div#interactions div.bubble div {
	position: absolute;
	width: 143px;
	height: 60px;
	top: 35px;
	left: 60px;
	vertical-align: top; /* ?? */
}

div#interactions div.bubble div div {
	position: static;
}

div#interactions div.bubble div div.preview-image{
	display: inline-block;
	vertical-align: top;
	padding: 2px;
	width: 50px;
}

div#interactions div.bubble div div.preview-image img{
	width: 50px;
	height: auto;
}

div#interactions div.bubble div div.preview-text {
	display: inline-block;
	width: 85px;
	word-wrap: break-word;
	padding: 2px;
}

a.bubbleSummary {
	font-weight: bold;
	font-size: 11px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: black;
	text-decoration: none;
}

a.bubbleLink {
	font-size: 10px;
	font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
	color: gray;
	text-decoration: none;
}
/*********************************************************/

/*********************************************************
*** Controls
*********************************************************/
div#controls {
	position: absolute;
	z-index: 2000;
	left: 0px;
	bottom: 0px;
}

div#controls img {
	padding: 15px;
}

#play {
	display: none;
}
/*********************************************************/

/**********************************************************
*** Messages
**********************************************************/
div.message {
	filter: alpha(opacity=0);
	opacity: 0;
	animation: fade_in 6s;
	-moz-animation: fade_in 6s;
	-webkit-animation: fade_in 6s;
	width: 40%;
	margin: 30% 30%;
	text-align: center;
	top: 0;
	position: absolute;
	z-index: 500;
}

div.message p {
	margin: 0 auto;
	width: 100%;
	color: #00FF00;
	font-size: 32px;
	font-weight: bold;
	font-family: Courier New;
}

@keyframes fade_in
{
	0%	{filter: alpha(opacity=0); opacity: 0; }
	15% {filter:alpha(opacity=80); opacity: 0.8; }
	85% {filter:alpha(opacity=80); opacity: 0.8; }
	100%	{filter: alpha(opacity=0); opacity: 0; }
}

@-moz-keyframes fade_in
{
	0%	{filter: alpha(opacity=0); opacity: 0; }
	15% {filter:alpha(opacity=80); opacity: 0.8; }
	85% {filter:alpha(opacity=80); opacity: 0.8; }
	100%	{filter: alpha(opacity=0); opacity: 0; }
}

@-webkit-keyframes fade_in
{
	0%	{filter: alpha(opacity=0); opacity: 0; }
	15% {filter:alpha(opacity=80); opacity: 0.8; }
	85% {filter:alpha(opacity=80); opacity: 0.8; }
	100%	{filter: alpha(opacity=0); opacity: 0; }
}
/*********************************************************/