html {
	height: 100%;
}
body {
    background: url(back.png);
    margin: 0; padding: 0;
    color: #eed;
    font-family: Verdana, Arial, sans-serif;
    font-size: 14px;
    height: 100%;
}

a { color: #9797ff; text-decoration: none; }
a:visited { color: #e2bb5f; text-decoration: none; }
a:hover { text-decoration: underline; }
a:active { color: #9797ff; }

.content-inner {
	border: 1px solid #444;
	-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
	padding: 15px 15px;
    background: rgba(7, 7, 17, 0.7);
    margin-top: 5px;
}

.form       { text-align: center; }
.form .file { width: 400px; }

.tb-btns-right { text-align: right; }

.tb-panel {
	height: 41px;
	background: rgba(2, 2, 5, 0.9); 
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	border: 1px solid #444;
	padding: 3px;
/*	width: 80%;
	margin-left: 10%;*/
}

.tb-panel table {
	width: 100%;
	border-collapse: collapse;
}

.tb-btn	{
	padding: 6px;
	height: 24px;
	cursor: pointer;
	margin: 0 2px;
	display: inline-block;
	border: 0px solid #444;
	background: rgba(7, 7, 17, 0.7);
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

.tb-btn:hover { background: rgba(27, 27, 66, 0.7); }
.tb-btn img	{  }

.tb-btn-active {
	padding: 6px;
	margin: 0 2px;
	display: inline-block;
	border: 1px solid #444;
	background: rgba(27, 27, 66, 0.7);
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

.g-guests		{ color: #FFF; } /* guest */
.g-free			{ color: #888; } /* free */
.g-users		{ color: #8F8; } /* vip */
.g-girls		{ color: #F6F; } /* girls */
.g-roleplayers	{ color: #CCF; } /* builders */
.g-codes		{ color: #888; } /* codes */
.g-mods			{ color: #F77; } /* mods */
.g-admins		{ color: #F44; } /* admins */
.g-premium		{ color: gold; } /* premium */
.g-helper		{ color: dodgerblue; } /* helper */

/********************************** CASCADED **********************************/

.tarea-msg {
	width: 100%;
	height: 300px;
	color: lightgray;
	background-color: rgba(0, 0, 0, 0.5);
	overflow: auto;

	border: 1px solid #444;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	padding: 3px 3px;
}

.tinput {
	width: 100%;
	color: lightgray;
	background-color: rgba(0, 0, 0, 0.5);
	overflow: auto;

	border: 1px solid #444;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	padding: 3px 3px;
}

.fullw {
	width: 100%;
}

.fullh {
	height: 100%;
}

.tbl {
	border-collapse: collapse;
}

.tbl-data tr:nth-child(2n) {
	background: #242733;
}

.tbl-data tr:nth-child(2n-1) {
	background: rgba(25, 27, 37, 1);
}

.tbl-centered tr td {
	text-align: center;
}

.tbl-header {
	background: rgba(2, 2, 5, 0.9);
}
.tbl-header td {
	text-align: center;
}

/*----------------------------------------------------------------------------*/

.tree {
	/* border: none; */
	margin: 2px 0px;
}

.tree .tbl {
	width: 100%;
	border-collapse: collapse;
}

.tree .title {
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	border: 1px solid #41434d;
	background: #272937;
	cursor: pointer;
}

.tree .title .text {
	padding-left: 2px;
	display: inline-block;
}

.tree .btn-item {
	-webkit-border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px; border-radius: 5px 0px 0px 5px;
	width: 20px; height: 20px;
	margin-left: -1px;
	border-right: 1px solid #2f3242;
	background: #41434d;
	cursor: pointer;
	color: #eed;
	display: inline-block;
	text-align: center;
}

.tree .btn-info {
	-webkit-border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px; border-radius: 5px 0px 0px 5px;
	width: 20px; height: 20px;
	margin-left: -1px;
	border-right: 1px solid #2f3242;
	background: #41434d;
	display: inline-block;
	text-align: center;
	color: #99F;
	cursor: pointer;
}

.tree .body {
	-webkit-border-radius: 0px 0px 5px 5px; -moz-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px;
	border: 1px solid #41434d;
	background: rgba(0, 0, 0, 0);
	padding: 5px;
	margin: -1px 0px 5px 20px;
	display: none;
}

/*----------------------------------------------------------------------------*/

.button {
	padding: 5px;
	display: inline-block;
	background: #2f3242;
	border: 1px solid #41434d;
	color: #eed;
	min-width: 50px;
	text-align: center;
}

.button:hover {
	background: #41434d;
	cursor: pointer;
}

.button:active {
	background: #16171a;
	cursor: pointer;
}


.button-green {
	background: #30432f;
	border: 1px solid #414d41;
}

.button-green:hover {
	background: #414d41;
}

.button-green:active {
	background: #16171a;
}

.button-red {
	background: #4a2828;
	border: 1px solid #523c3c;
}

.button-red:hover {
	background: #523c3c;
}

.button-red:active {
	background: #16171a;
}

.button-brown {
	background: #504e2c;
	border: 1px solid #605f36;
}

.button-brown:hover {
	background: #605f36;
}

.button-brown:active {
	background: #16171a;
}

.button-train {
	border-left: 0;
}

/*-----------------------  CONSTRUCTOR  --------------------------------------*/

.menu {
	height: 20px;
}

.menu .item {
	padding: 6px;
	cursor: pointer;
	display: inline-block;
	border: 0px solid #444;
	background: rgba(7, 7, 17, 0.7);
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

.menu .item:hover { background: #272937; }

.menu .item-active {
	padding: 6px;
	display: inline-block;
	border: 0px solid #444;
	background: rgba(27, 27, 66, 0.7);
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}

/*----------------------------------------------------------------------------*/

.pan {
	vertical-align: top;
	border: 1px solid #555866;
	padding: 5px 5px;
/*	background: #191b25;*/
	background: rgba(25, 27, 37, 0.85);
	margin-top: 2px;
}

.pan .name {
	border-bottom: 1px dashed #444;
	color: #e2bb5f;
	font-size: 80%;
	padding-left: 2px;
}

.pan .info {
	padding: 2px 0px 0px 10px;
}

/*----------------------------------------------------------------------------*/

.window {
	position: absolute;
	vertical-align: top;
	border: 1px solid #555866;
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
	padding: 7px 7px;
    background: #191b25;
    margin-top: 2px;
}

.window .title {
	border-bottom: 1px dashed #444;
	color: #e2bb5f;
	font-size: 110%;
	padding: 0px;
}

.window .content {
	padding: 5px 0px;
}

.window .controls {
	width: 100%;
	border-top: 1px dashed #444;
}

.window .controls .button {
	margin-left: 5px;
	padding: 6px;
	cursor: pointer;
	display: inline-block;
}

/*----------------------------------------------------------------------------*/

.popup-window {
	left: 100%;
	top: 100%;
	width: 200px;
	margin-left: -250px;
	margin-top: -70px;

	position: fixed;
	padding: 10px;
	
	background-color: rgba(25, 27, 37, 0.85);
	border: 1px solid #555866;
	border-radius: 10px;
	box-shadow: 0 0 10px white;
}

/*----------------------------------------------------------------------------*/

.tools {
	margin: 6px 0px 0px 25px;
	position: absolute;
	background-color: rgba(255, 255, 255, 0.15);
	border-radius: 5px;
	padding: 5px;
}

/*----------------------------------------------------------------------------*/

.project-tree {
	width: 15%;
	min-width: 100px;
}

ul#project-tree {
	padding-left: 10px;
}

ul#project-tree li {
	cursor: pointer;
	list-style: outside none none;
}

.workbench {
	width: 70%;
	min-width: 400px;
}

.controls {
	width: 15%;
	min-width: 100px;
}

.controls .button {
	margin-left: 5px;
	margin-top: 5px;
	padding: 6px;
	cursor: pointer;
	display: block;
}
/*
.controls .button:hover { background: rgba(27, 27, 66, 0.7); }
*/

.console {
	height: 7%;
	vertical-align: middle;
	text-align: center;
}

.console-content {
	overflow-y: scroll;
}

.console-content p {
	margin: 0;
}

.paintbox {
	width: 100%;
	height: 100%;
}

.blocks {
	width: 40px;
	text-align: left;
	vertical-align: top;
}

#paintbox {
	padding-bottom: 6px;
	outline: none;
}

.ctl-selected {
	border: 2px solid #8c98ad;
	margin: 0;
}

.block {
	background-image: url(blocks.png);
	width: 32px;
	height: 32px;
	margin: 2px;
}

.selection-block {
	background-image: url(selection.png);
	width: 32px;
	height: 32px;
	margin: 2px;
}

.tool-widget-label {
	background-image: url(label.png);
	width: 32px;
	height: 32px;
	margin: 2px;
}

input, textarea {
	color: lightgray;
	background-color: rgba(0, 0, 0, 0.5);
	overflow: auto;

	border: 1px solid #444;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	padding: 3px 3px;
}