body, textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	width: 100%;
	margin: 0;
}

textarea {
	font-size: 12px;
}

.container {
	position: absolute;
	left: 50%;
	margin-left: -320px;
	margin-top: 10px;
	width: 642px;
}

canvas {
	border: 1px solid black;
}

#controls {
	width: 100%;
	padding: 10px;
}

#undo_redo_container {
	line-height: 30px;
	padding: 0 10px 0 10px;
	margin-left: 50px;
}

#undo_redo_container button {
	margin-left: 10px;
}

#game_storage_container {
	float: right;
	line-height: 30px;
	padding: 0 10px 0 10px;
}

#game_storage_message {
	font-weight: bold;
	color: #080;
	float: left;
}

#new_game_button {
	margin-left: 10px;
}

#new_game_button, #save_local_game_name, #save_local_game_button, #load_local_game_name {
	margin-right: 10px;
}

.vertical_divider {
	width: 1px;
	border-left: 1px solid #ccc;
	margin-right: 10px;
}

#game_loader {
	padding: 10px;
	text-align: center;
}

#game_loader div {
	font-weight: bold;
	margin-bottom: 8px;
}

#game_loader textarea {
	width: 100%;
	height: 40px;
}

#game_loader button {
	float: right;
	padding: 4px 8px 4px 8px;
}

#controls_header {
	text-align: center;
	font-weight: bold;
}

.td_left {
	text-align: right;
	width: 50%;
	padding-right: 20px;
	padding-top: 4px;
}

.td_right {
	text-align: left;
	width: 50%;
	padding-left: 20px;
	padding-top: 4px;
}

/* Editor */

#container {
	width: 100%;
	height: 100%;
	padding: 10px 10px 0 10px;
}

#container, #container table {
	border-spacing: 0;
}

#container td {
	padding: 0;
}

.game_event_chain_table {
	border-collapse: collapse;
}

.game_event_chain_table tr {
	background-color: #bbd;
}

.game_event_chain_table tr.spacer {
	height: 10px;
	background-color: none;
}

.game_event_chain_table > tbody > tr > td:first-child {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

.game_event_chain_table > tbody > tr > td {
	vertical-align: middle !important;
	padding: 10px !important;
	box-shadow: 0 0 0 2px #55a;
}

.game_event_chain_table > tbody > tr > td:last-child {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	border-right-width: 0px;
}

.editor_table td {
	padding: 5px !important;
	border-bottom: 2px solid #ccc;
}

#editor_tabs {
	height: 30px;
	padding-bottom: 10px !important;
}

#left_half {
	background-color: #ddddff;
	float: left;
	overflow: auto;
}

#right_half {
	vertical-align: top;
}

#settings_container_left {
	width: 100%;
	height: 100%;
	margin-right: 10px;
	padding-right: 25px !important;
}

#settings_container_left textarea {
	width: 400px;
	height: 28px;
}

#settings_container_right {
	width: 532px;
	height: 100%;
	overflow: auto;
}

#right_half_container {
	height: 100%;
	width: 532px;
	margin-left: 10px;
}

#tooltip {
	display: none;
	position: absolute;
	background-color: #fff;
	border: 1px solid #000;
	padding: 8px;
}

#tile_info {
	display: none;
	position: absolute;
	background-color: #fff;
	border: 1px solid #000;
	padding: 8px;
}

#popup_shade {
	position: absolute;
	background-color: #000;
	opacity: 0.5;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: none;
}

#popup_sprite_selector_container {
	position: absolute;
	width: 400px;
	height: 400px;
	top: 20px;
	background-color: #fff;
	left: 50%;
	margin-left: -200px;
	overflow: auto;
	display: none;
}

.sprite_picker_container {
	height: 256px;
	width: 516px;
	float: left;
	margin-bottom: 10px;
	overflow-y: auto;
}

#editor_tabs_container, .object_editor_tabs_container {
	height: 100%;
}

.selected {
	background-color: #eff;
}

.tab_headers {
	height: 30px;
	float: left;
}

.tab_header {
	float: left;
	line-height: 30px;
	padding: 0 10px 0 10px;
	cursor: pointer;
	background-color: #bbbbbb;
}

.tab_header.selected {
	background-color: #eee;
}

.tab_header:hover {
	background-color: #ffffff;
}

.tab {
	background-color: #eee;
	height: 100%;
	width: 516px;
	overflow-y: auto;
	padding: 8px;
	float: left;
}

#screen_editor_tab .tab {
	width: 616px;
}

.tab table {
	float: left;
}

h4 {
	margin-top: 5px;
	margin-bottom: 5px;
}

#size_buttons_container {
	float: right;
}

#size_buttons_container .center {
	text-align: center;
}

#size_x_up_button_pre, #size_x_down_button_pre,
#size_x_up_button, #size_x_down_button {
	width: 24px;
	height: 100px;
}

#size_y_up_button_pre, #size_y_down_button_pre,
#size_y_up_button, #size_y_down_button {
	width: 100px;
	height: 24px;
}

#size_x_up_button_pre, #size_x_up_button,
#size_y_up_button_pre, #size_y_up_button {
	background-color: #0c0;
}

#size_x_down_button_pre, #size_x_down_button,
#size_y_down_button_pre, #size_y_down_button {
	background-color: #c00;
}

#layer_visibility_toggles {
	float: left;
	clear: left;
}

#layer_container div, #layer_container input {
	float: left;
}

.layer_visiblity_toggle {
	width: 16px;
	height: 16px;
	margin-top: 2px;
}

textarea {
	width: 160px;
	height: 60px;
}

.export_json_container {
	line-height: 0;
}

#maps_container td, #map_characters_container td,
#warps_container td, #signs_container td, #battlers_container td, #events_container td {
	text-align: center;
}

#battlers_container .battlers_name_input {
	width: 100px;
}

#export_json {
	height: 60px;
	width: 526px;
}

#export_json_object_editor {
	height: 60px;
	width: 626px;
	display: none;
}

/*
 * Object Editor
 */

#editor_loading_screen {
	position: absolute;
	top: 40%;
	width: 100%;
	text-align: center;
	font-size: 60px;
}

#object_editor_inner_main_area {
	height: 100%;
}

.object_editor_tab {
	padding: 0;
}

.object_editor_tab_cell {
	height: 100%;
}

.object_editor_inner_tab {
	padding: 8px;
}

.object_editor_tab_container {
	height: 100%;
}

#object_editor_tab #object_editor_inner_main_area .tab {
	float: none;
	width: auto;
}

#object_editor_tab_headers_container {
	position: absolute;
	top: 0;
	left: 0;
}

.object_editor_advanced_tab {
	margin-left: 10px;
	width: 632px;
	height: 100%;
	float: right;
}

#object_editor_inner_main_area .tab {
	overflow-x: auto;
	height: 100%;
}

#object_editor_right table, #object_editor_right table td {
	height: 100%;
}

.number {
	width: 30px;
}

#object_editor_tab td {
	vertical-align: top;
}

#object_editor_inner_container {
	position: relative;
	padding-top: 30px;
	width: 100%;
	height: 100%;
	overflow-y: auto;
}

#settings_tab {
	height: 100%;
	padding-right: 20px;
}

#object_editor_inner_main_area .tab, #settings_tab .tab {
	background-color: #eee;
	height: 100%;
	width: 100%;
	overflow-y: auto;
	overflow-x: auto;
	margin: 0;
}

#settings_tab .tab td {
	padding: 5px;
}

#object_editor_inner_main_area .tab td {
	text-align: center;
}

.object_editor_tabs_container td {
	text-align: center;
	padding: 5px !important;
}

.object_editor_tabs_container div > table:not(.game_event_chain_table) > tbody > tr > td {
	border-bottom: 2px solid #ccc;
}

#battler_type_stats_container td {
	text-align: right;
}

#screen_editor_left {
	float: left;
	overflow: auto;
}

#screen_editor_right {
	width: 616px;
	height: 100%;
	margin-right: 10px;
}

.hidden {
	display: none;
}

.tool_selector {
	width: 50px;
	height: 40px;
	float: left;
	margin-bottom: 10px;
	text-align: center;
	vertical-align: middle;
	margin-right: 10px;
	cursor: pointer;
	padding-top: 10px;
	
	background-color: #ccc;
}

.tool_selector.selected {
	background-color: #fff !important;
}

.tool_selector:hover {
	background-color: #fff;
}

#tile_info {
	min-width: 220px;
}

#tile_info table {
	width: 100%;
}

#tile_info table tr td {
	vertical-align: top;
}

#tile_info .tile_info_sprite_picker_container {
	text-align: center;
}

#tile_info .tile_info_layer_name {
	font-weight: bold;
	padding-bottom: 5px;
}

#tile_info .tile_info_delete {
	text-align: right;
}

#tile_info .tile_info_checkboxes {
	padding-left: 10px;
	vertical-align: top;
}

.breaker {
	clear: both;
}
