/* Copyright 2011, Spacetime Studios, Inc.  All Rights Reserved. */

body
{
	color:#FFFFFF;
	background-color:#000000;
	margin:0;
	overflow:hidden;
	font-family:'Open Sans', arial, sans-serif;
	font-size:13px;
	font-weight:bold;
}

a:link {color: #FFFFFF;}
a:active {color: #FFFFFF;}
a:visited {color: #FFFFFF;}
a:hover {color: #FFFFFF;}
img {border: none;}

div#background
{
	position:absolute;
	top:0%;
	left:50%;
	width:1680px;
	height:1050px;
	margin-left:-840px;
	margin-top:-34px;
	background-image:url('../img/background-2.png');
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	overflow:visible;
}

div#branding
{
	position:relative;
	width:100%;
	height:107px;
}

div#game_logo
{
	position:relative;
	top:0px;
	width:600px;
	height:80px;
	margin-left:auto;
	margin-right:auto;
}

div#engine_logo
{
	position:absolute;
	width:138px;
	height:50px;
	top:0;
	right:0;
}

div#fullscreen
{
	position:absolute;
	width:40px;
	height:40px;
	top:0px;
	left:0px;
}

div#container
{
	position:relative;
	width:1024px;
	height:768px;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:0px;
	overflow:visible;
}

div#listener
{
	position:relative;
	width:100%;
	height:100%;
}

div#loading
{
	background-image:url('../img/background-2.png');
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:2;
}

div#loading_anim
{
	position:relative;
	margin-left:auto;
	margin-right:auto;
	width:64px;
	height:64px;
	background-image:url('../img/loading-2.gif');
	background-repeat:no-repeat;
	background-position:center;
}

div#loading_status
{
	text-align:center;
	left:30%;
	right:30%;
}

div.align_bottom
{
	position:absolute;
	bottom:0%;
	width:100%;
}

div.load_err
{
	position:absolute;
	top:30%;
	left:32%;
	width:40%;
	height:40%;
}

div.load_err_title
{
	position:absolute;
	width:100%;
	height:15%;
	text-align:center;
}

div.load_err_body
{
	position:absolute;
	top:23%;
	width:100%;
	height:77%;
	text-align:center;
}

div.cv_table
{
	display:table;
	height:100%;
	width:100%;
}

div.cv_cell
{
	display:table-cell;
	vertical-align:middle;
}

a.sts_button
{
	display:block;
	width:233px;
	height:51px;
	margin-left:auto;
	margin-right:auto;
	padding-top:16px;
	padding-left:0px;
	text-decoration:none;
	background-image:url('../img/button_sts-1.png');
	background-repeat:no-repeat;
}

a.sts_button:hover
{
	width:233px;
	height:51px;
	background-image:url('../img/button_sts_click-1.png');
	background-repeat:no-repeat;
}

#game
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:1;
}

div#keymap_expanded
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:3;
	background-color:#202020;
	display:flex;
	flex-direction:column;
}

div.keymap_section
{
	margin:10px;
	flex-grow:1;
	display:flex;
	flex-direction:column;
	min-height:0;
}

div.keymap_v
{
	display:flex;
	flex-direction:column;
	flex-grow:1;
	overflow:auto;
	min-height:0;
	background-color:#101010;
}

div.keymap_h
{
	display:flex;
	flex-direction:row;
	flex-grow:1;
	justify-content:center;
}

div.keymap_h div
{
	width:25%;
	text-align:center;
	align-content:center;
}

div.keymap_row_header
{
	background-color:#303030;
	color:#f0f0f0;
	border:1px solid white;
	user-select:none;
}

div.keymap_column_header
{
	background-color:#e0e0e0;
	color:#000000;
	border:1px solid white;
	user-select:none;
}

div.keymap_inactive
{
	border:1px solid grey;
	color:#f0f0f0;
	user-select:none;
}

div.keymap_active
{
	border:1px solid green;
	color:#f0f0f0;
	user-select:none;
}

div.keymap_title
{
	color:#f0f0f0;
	padding:0 0 12px 0;
	text-align:center;
	font-size:150%;
	user-select:none;
}

div.keymap_close
{
	background-color:#d0d0d0;
	color:#000000;
	border:8px;
	border-radius:8px;
	position:absolute;
	right:8px;
	top:8px;
	padding:8px 10px 8px 10px;
	text-align:center;
	user-select:none;
}

div.keymap_close:hover
{
	background-color:#f0f0f0;
}

div.keymap_header
{
	display:flex;
	flex-direction:row;
	justify-content:center;
}

div.keymap_footer
{
	display:flex;
	flex-direction:row;
	justify-content:center;
}

div.keymap_action
{
	background-color:#d0d0d0;
	color:#000000;
	border:8px;
	border-radius:5px;
	margin:16px;
	padding:8px;
	width:200px;
	text-align:center;
	user-select:none;
}

div.keymap_action:hover
{
	background-color:#f0f0f0;
}

div.keymap_dialog
{	
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	display:flex;
	flex-direction:column;
}

div.keymap_dialog_bg
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#000000;
	opacity:50%;
}

div.keymap_dialog_title
{
	color:#000000;
	padding:0 0 12px 0;
	text-align:center;
	font-size:150%;
	user-select:none;
}

div.keymap_dialog_window
{
	background-color:#808080;
	display:flex;
	flex-direction:column;
	z-index:4;
	margin:auto;
	padding:16px;
	border:16px;
	border-radius:16px;
}