.clear        { clear:both; }
.left         { float:left; margin-right: 2em; }
.right        { float:right; margin-left: 2em; }
img.left      { margin-right:1em; margin-bottom:1.8em; }
img.right     { margin-left:1em; margin-bottom:1.8em; }
.text-right   { text-align:right; }
.text-center  { text-align:center; }
.half         { width:45%; /* Not exactly half to account for paddings, margins etc. */ }
.full		  { width:100%; }
.white  	  { color: #FFF;}
.strong  	  { font-weight: bold;}
.nostyle	  { list-style-type: none; }
a.nostyle	  { text-decoration: none; }
.ml-reset	  { margin-left: 0; }
.mr-reset	  { margin-right: 0; }

/*********************************
 ** END HELPERS / RESET
**********************************/

#wrapper {
	width: 100%;
	height: 100%;
	font-size: 8.5pt;
}

#alchemy {
	width: 100%;
}

#workbench {
	background: url(../img/workbench.png);
}

#black-hole {
	position: absolute;
	top: 0;
	right: 0;
	width: 100px;
	height: 100px;
	background: url(../img/blackhole.png);
}

#logo {
	width: 200px;
	margin: 0 auto;
}

#menu {
	background: url(../img/menu.png);
}

#elements {
	height: auto;
	overflow-y: scroll;
	overflow-x: hidden;
}

#elements h4{
	padding: 0 5px;
}

.workbench {
	width: 60px;
	height: 50px;
	text-align: center;
	color: #FFF;
	padding-top: 10px;
}

.workbench:hover {
	cursor: pointer;
}

.element {
	width: 50px;
	margin-right: 2px;
	margin-bottom: 2px;
	text-align: center;
}

.element:hover {
	cursor: pointer;
}

h4.panel-title {
	margin: 5px 0;
}

.panel-body {
	padding: 5px;
}

.fire {
	background: #A60000;
	color: #FFFFFF;
}

.water {
	background: #2C17B1;
	color: #FFFFFF;
}

.stone {
	background: #E4E4E4;
	color: #000000;
}

.air {
	background: #4E94CF;
}

.life {
	background: #D647BF;
}

.golems {
	background: #9F5609;
	color: #FFFFFF;
}

.basic_animal {
	background: #000000;
	color: #FFFFFF;
}

.animal {
	background: #AAAAAA;
}

.basic_material {
	background: #EEEEEE;
}

.human {
	background: #8BE070;
}

.food {
	background: #F2E34D;
}

.plants {
	background: #237E06;
	color: #FFFFFF;
}

.technology {
	background: #0F7D8C;
	color: #FFFFFF;
}

.explosives {
	background: #E53515;
}

.civ {
	background: #C2DE14;
}

.countries {
	background: #E5AC15;
}

.planets {
	background: #7D4FCD;
	color: #FFFFFF;
}

.military {
	background: #287C47;
	color: #FFFFFF;
}