/*
- Copyright (c) 2012 Research In Motion Limited.
-
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
*/

a:link, a:visited, a:hover, a:active {
	color: #88AAFF;
}

body {
	background-color: black;
	cursor: default;
	font-family: sans-serif;
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;	
}

canvas.button {
	position: absolute;
	/* -webkit-transition: opacity 200ms cubic-bezier(0.075, 0.820, 0.165, 1.000); */
}

canvas.joystick {
	position: absolute;
	/* -webkit-transition: opacity 800ms cubic-bezier(0.075, 0.820, 0.165, 1.000); */
}

#container {
	bottom: 0px;
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: -1;
}

#canvas {
	border: none;
	height: 100%;
	width: 100%;
}

.panel {
	background: black;
	color: white;
	max-height: 80%;
	opacity: 0.5;
	position: absolute;
	top: 0px;
	width: 50%;
	z-index: 100;
	-webkit-transition: all 500ms cubic-bezier(0.075, 0.820, 0.165, 1.000);
}

#bbm, #about, #license {
	overflow: scroll;
	overflow-x: hidden;
}

#bbm {
	height: 80%;
}

.panel.left {
	-webkit-transform: translate3d(-100%, 0, 0);
}

.panel.left.open {
	-webkit-transform: translate3d(0%, 0, 0);
}

.panel.right {
	-webkit-transform: translate3d(200%, 0, 0);
}

.panel.right.open {
	-webkit-transform: translate3d(100%, 0, 0);
}