/* Created with RAGE ButtonDesign http://www.ragesw.com/products/buttondesign/ */

div.sidebar
{
background-color: 003d01;
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100px;
}

div.home {
	float: left;
	width: 98px;
	height: 50px;
}


div.home a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('home.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.home span {
	position: relative;
	top:3px;
	}


div.home a:hover {
	background-position: -98px 0;
	color: #FFFFFF;
}


div.home a:active {
	background-position: -196px 0;
	color: #999999;
}

div.calendar {
	float: left;
	width: 98px;
	height: 50px;
}


div.calendar a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('calendar.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.calendar span {
	position: relative;
	top:3px;
	}


div.calendar a:hover {
	background-position: -98px 0;
	color: #FFFFFF;
}


div.home a:active {
	background-position: -196px 0;
	color: #999999;
}


div.akasha {
	float: left;
	width: 98px;
	height: 50px;
}


div.akasha a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('akasha.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 12px;
	text-align: left;
}


div.akasha span {
	position: relative;
	top:3px;
	}


div.akasha a:hover {
	background-position: -98px 0;
	color: #FFFFFF;
}


div.akasha a:active {
	background-position: -196px 0;
	color: #999999;
}

div.air {
	float: left;
	width: 98px;
	height: 50px;
}


div.air a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('air.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	letter-spacing: -2px;
	font-weight: bold;
	line-height: 12px;
	text-align: left;
}


div.air span {
	position: relative;
	top:3px;
	}


div.air a:hover {
	background-position: -98px 0;
	color: #dddf00;
}


div.air a:active {
	background-position: -196px 0;
	color: #999999;
}

div.fire {
	float: left;
	width: 98px;
	height: 50px;
}


div.fire a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('fire.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	letter-spacing: -1px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.fire span {
	position: relative;
	top:3px;
	}


div.fire a:hover {
	background-position: -98px 0;
	color: #e20308;
}


div.fire a:active {
	background-position: -196px 0;
	color: #999999;
}

div.water {
	float: left;
	width: 98px;
	height: 50px;
}


div.water a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('water.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	letter-spacing: -1px;
	font-weight: bold;
	line-height: 12px;
	text-align: left;}


div.water span {
	position: relative;
	top:3px;
	}


div.water a:hover {
	background-position: -98px 0;
	color: #0337e2;
}


div.water a:active {
	background-position: -196px 0;
	color: #999999;
}

div.earth {
	float: left;
	width: 98px;
	height: 50px;
}


div.earth a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('earth.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.earth span {
	position: relative;
	top:3px;
	}


div.earth a:hover {
	background-position: -98px 0;
	color: #59512d;
}


div.earth a:active {
	background-position: -196px 0;
	color: #999999;
}

div.pent {
	float: left;
	width: 98px;
	height: 50px;
}


div.pent a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('pent.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.pent span {
	position: relative;
	top:3px;
	}


div.pent a:hover {
	background-position: -98px 0;
	color: #000000;
}


div.pent a:active {
	background-position: -196px 0;
	color: #999999;
}

div.moon {
	float: left;
	width: 98px;
	height: 50px;
}


div.moon a {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
	background: url('moon.jpg') top left no-repeat;
	color: #FFFFFF;
	font-family: 'Helvetica';
	font-size:14px;
	font-weight: bold;
	line-height: 50px;
	text-align: left;
}


div.moon span {
	position: relative;
	top:3px;
	}


div.moon a:hover {
	background-position: -98px 0;
	color: #8f05d6;
}


div.moon a:active {
	background-position: -196px 0;
	color: #999999;
}