* { 
	margin:0px; 
	padding:0px;
	outline: none;
	zoom:1;
}

html {
	overflow: hidden;
    width:740px;
    height:295px;
}

body {
    width:740px;
	height:295px;
}

#nature_box {
	position:absolute;
	width:740px;
	height:295px;
	background:#d0eab3;
}

/* --- Picture Container --- */
div.pictureframe {
	background:black;
	position:absolute;
	height:295px;
	width:211px;
}

#avatar {
	display: block;
	margin: 12px auto;
}

/* --- Menu Container --- */
#menu {
	list-style:none;
	width:80px;
	height:295px;
	position:absolute;
	left:211px;
	z-index:0;
}

#menu li {
	text-align: center;
	height:58px;
	font-family: calibri,Arial,Helvetica,sans-serif;
	font-size: 0.875em;
	border-bottom:1px solid black;
	background:#8dc63f;
	background: -o-linear-gradient(left,rgb(69,106,36),rgb(141,198,63));
	background: -moz-linear-gradient(left, #476c2c, #8dc63f);
	background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#476c2c), to(#8dc63f));
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#8dc63f')";
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#8dc63f');
}

#menu li.last {
	height:59px;
	border-bottom:none;
}

#menu li:focus,
#menu li:hover,
#menu li.active {
	background:#ccff66;
	background: -o-linear-gradient(left,rgb(102,153,51),rgb(204,255,102));
	background: -moz-linear-gradient(left, #669933, #ccff66);
	background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#669933), to(#ccff66));
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#669933', endColorstr='#ccff66')";
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#669933', endColorstr='#ccff66');
}

#menu li:active {
	background:#476c2c;
	background: -o-linear-gradient(left,rgb(71,108,44),rgb(204,255,102));
	background: -moz-linear-gradient(left, #476c2c, #ccff66);
	background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#476c2c), to(#ccff66));
}

#menu li a {
	text-decoration:none;
	display: block;
	width:80px;
	padding: 39px 0px 3px 0px;
	color:black;
}

/* --- Icons --- */

.icon { 
	background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TZ9Kc2lDKpI/AAAAAAAAHqw/BLcQzwSsvWA/menu_icon_s.png') no-repeat !important;
}

.abilities,
#menu li a.abilities:active  {
	background-position: 5px 0px !important;
}
.information,
#menu li a.information:active  {
	background-position: -75px 0px !important;
}
.upgrades,
#menu li a.upgrades:active  {
	background-position: -155px 0px !important;
}
.link,
#menu li a.link:active  {
	background-position: -235px 0px !important;
}
.chat,
#menu li a.chat:active  {
	background-position: -315px 0px !important;
}

/* --- Division Container --- */

.abilities_div, 
.information_div, 
.upgrades_div, 
.link_div, 
.chat_div {
	z-index:-1;
	left:-999em;
	width:426px;
	position:absolute;
}


#menu li:hover .link_div, 
#menu li:focus .abilities_div, 
#menu li:focus .information_div, 
#menu li:focus .upgrades_div, 
#menu li:focus .chat_div,
#menu li:focus .link_div,
#menu li:active .abilities_div, 
#menu li:active .information_div, 
#menu li:active .upgrades_div,  
#menu li:active .chat_div,
#menu li:active .link_div,
#menu li.active .abilities_div, 
#menu li.active .information_div, 
#menu li.active .upgrades_div,
#menu li.active .chat_div,
#menu li.active .link_div {
    left:-1px;
    top:auto;
}

.arrow {
	position:absolute;
	margin-top:-43px;
	left:69px;
	z-index:1;
	width:25px;
	height:25px;
	background:#ccff66;	

	-o-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45.5deg);
	transform: rotate(45deg);

	-moz-box-shadow: 1px 0px 5px #888;
	-webkit-box-shadow: 1px 0px 5px #888;
	box-shadow: 1px 0px 5px #888;
}

/* --- Information Container --- */

.box_abilities, 
.box_information, 
.box_upgrades, 
.box_chat  {
	left:81px;
	height:295px;
	width:426px;
	z-index:-1;
	background:#d0eab3;
    background:white;
	text-align:left;
	font: 12px calibri,arial,helvetica,san-serif;
	position:absolute;
	display:table;

	-moz-box-shadow: inset 5px 0px 5px -5px #888;
	-webkit-box-shadow: inset 5px 0px 5px -5px #888;
	box-shadow: inset 5px 0px 5px -5px #888;
}

.box_upgrades {
    top:-178px;
}
.box_link {
	top:-296px;
}
.box_chat {
	top:-237px;
    left:61px;
}
.box_abilities {
	top:-60px;
}
.box_information {
    top:-119px;
}

.box_chat  {
    display:block;
    background:white;
}
.contents {
    display:table-cell;
	padding-left:20px;
    vertical-align: middle;
}

.abilities_contents {
    font-style:italic;
}

/* --- Table Format: Information --- */

.label_information {
    width:70px;
}

.edition {
    padding-bottom:1em;
}

.orb_count,
.subtype {
    font-style:italic;
}

/* --- Table Format: Upgrades --- */

#table_standard,
#table_advance,
#table_expert {
    border-collapse:collapse;
    border-style:none;
}

#table_standard {
    border:5px solid #9bbb59;
    background:#ebf1de;
    margin-right:10px;
}

#table_advance {
    border:5px solid #f79646;
    background:#fde9d9;
    margin-right:10px;
}

#table_expert {
    border:5px solid #c0504d;
    background:#f2dcdb;
}

.column_label {
    width:90px;
}

.column_value {
    width:20px;
}

.upgrade_one,
.upgrade_two,
.upgrade_three {
    font-weight:normal;
    text-align:center;
    color:white;
}

.upgrade_one {
    background:#9bbb59;
}
.upgrade_two {
    background:#f79646;   
}
.upgrade_three {
    background:#c0504d;
}

.loot_map_one,
.loot_map_two,
.loot_map_three {
    color:white;
    text-align:center;
}

td.loot_map_one {
    background:#9bbb59;
}
td.loot_map_two {
    background:#f79646;
}
td.loot_map_three {
    background:#c0504d;
}
.honor_tokens_one,
.value_honor_one,
.battle_tokens_one,
.value_battle_one {
    background:#d8e4bc;
}
.honor_tokens_two,
.value_honor_two,
.battle_tokens_two,
.value_battle_two {
    background:#fcd5b4;
}
.honor_tokens_three,
.value_honor_three,
.battle_tokens_three,
.value_battle_three {
    background:#e6b8b7;
}

.standard,
.advance,
.expert {
    display: block;
}

/* --- Table Link --- */
.box_link {
    left:81px;
    height:59px;
	width:426px;
	z-index:-1;
	text-align:left;
	font: 12px calibri,arial,helvetica,san-serif;
	position:relative;
	display:table;
} 
.link_table {
    -moz-box-shadow: 1px 0px 5px #888;
	-webkit-box-shadow: 1px 0px 5px #888;
	box-shadow: 1px 0px 5px #888;
}

.link_table {
    margin-top:236px;
    margin-left:-20px;
    background:#ccff66;
    border: 5px solid #ccff66;
    border-left: 25px solid #ccff66;
    height:59px;
}

input {
    width:320px;
    margin-left:5px;
}

/* --- Next and Previous Buttons --- */

.next, 
.previous {
	display:block;
	position:absolute;
	width:23px;
	height:147.5px;
	left:506px;

	background:#8dc63f;
	background: -o-linear-gradient(right,rgb(69,106,36),rgb(141,198,63));
	background: -moz-linear-gradient(right, #8dc63f, #6a9c3b);
	background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#8dc63f), to(#6a9c3b));

	-moz-box-shadow: -1px 0px 5px #888;
	-webkit-box-shadow: -1px 0px 5px #888;
	box-shadow: -1px 0px 5px #888;
}

.next {
	top:0px;
	border-bottom:1px solid black;
}

.previous {
	top:148px;
}	

.next:hover, 
.previous:hover,
.next:focus,
.previous:focus {
	background:#ccff66;
	background: -o-linear-gradient(right,rgb(69,106,36),rgb(141,198,63));
	background: -moz-linear-gradient(right, #ccff66, #aee157);
	background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#ccff66), to(#aee157));
	cursor:pointer;
}

.next_arrow,
.previous_arrow {
	position:absolute;
	z-index:1;
	top:66px;

	border-color: transparent transparent transparent black;
	border-style:solid;
	border-width:10px;
	width:0;
	height:0;

	_border-left-color: pink;
	_border-bottom-color: pink;
	_border-top-color: pink;
	_filter: chroma(color=pink);
}

.next_arrow {
	left:6px;
	border-color: transparent transparent transparent black;
}

.previous_arrow {
	left:-4px;
	border-color: transparent black transparent transparent;
}

/* --- Map Icons --- */
.map_small {
    display:block;
	height:110px;
	width:110px;
}

.Behind_Enemy_Lines {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaBybuzHp1I/AAAAAAAAHrc/4khze-laXt8/Behind-Enemy-Lines.png') no-repeat;
}
.Defending_Hope {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaBydeOkt2I/AAAAAAAAHrs/fSzKxJiY6Jk/Defending-Hope.png') no-repeat;
}
.Encounters_with_Twilight {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaByd1fVGjI/AAAAAAAAHr0/271E5cAW0B0/Encounters-with-Twilight.png') no-repeat;
}
.Introduction {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaByecPLg5I/AAAAAAAAHr4/ALyz5CfX4tE/Introduction.png') no-repeat;
}
.Siege_of_Hope {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByhvNtZpI/AAAAAAAAHsc/5pUZRwEa8Lg/Siege-of-Hope.png') no-repeat;
}
.The_Soultree {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaByj6j3CTI/AAAAAAAAHs0/5dhmjDdL7UY/The-Soultree.png') no-repeat;
}
.The_Treasure_Fleet {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaBykXbkOHI/AAAAAAAAHs4/tuZa9vIbatc/The-Treasure-Fleet.png') no-repeat;
}
.Mo {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByfAC3GCI/AAAAAAAAHsA/SjIo8_X-5lI/Mo.png') no-repeat;
}
.Ocean {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaBygDWy4jI/AAAAAAAAHsM/Ld8VdUKck1I/Ocean.png') no-repeat;
}
.Oracle {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaBygkQYUOI/AAAAAAAAHsQ/Mhy3FbYI8gk/Oracle.png') no-repeat;
}
.The_Insane_God {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByjqkhpwI/AAAAAAAAHsw/A4peS9FGnhs/The-Insane-God.png') no-repeat;
}
.Crusade {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaBycwkVqpI/AAAAAAAAHro/WoEWTUqhtAQ/Crusade.png') no-repeat;
}
.Sunbridge {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaByiV3YHkI/AAAAAAAAHsk/jOqwAbjU1Oo/Sunbridge.png') no-repeat;
}
.Nightmare_Shard {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaByf3i_EEI/AAAAAAAAHsI/wBF9OKUozQI/Nightmare-Shard.png') no-repeat;
}
.Nightmares_End {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByfpP1tFI/AAAAAAAAHsE/zvc55SRpDjU/Nightmares-End.png') no-repeat;
}
.Convoy {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaByctHT1SI/AAAAAAAAHrk/MvvgJVxstpE/Convoy.png') no-repeat;
}
.Slave_Master {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaByh4SimbI/AAAAAAAAHsg/rip7tpyg3m4/Slave-Master.png') no-repeat;
}
.Dwarven_Riddle {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByi5Q0jVI/AAAAAAAAHso/_yVfc_BK0C4/The-Dwarven-Riddle.png') no-repeat;
}
.Guns_of_Lyr {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaByjXhbvDI/AAAAAAAAHss/QmOqJdkR7-c/The-Guns-of-Lyr.png') no-repeat;
}
.Bad_Harvest {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaBybnJgWbI/AAAAAAAAHrY/Lc3SqZMd7Ak/Bad-Harvest.png') no-repeat;
}
.King_of_the_Giants {
    background: url('http://lh3.googleusercontent.com/_qvhVKLFln2A/TaBye03vzVI/AAAAAAAAHr8/NZAgYXT037A/King-of-the-Giants.png') no-repeat;
}
.Titans {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaBykoyKEGI/AAAAAAAAHs8/Ju6F9gmrHT8/Titans.png') no-repeat;
}
.Blight {
    background: url('http://lh6.googleusercontent.com/_qvhVKLFln2A/TaBycNdxz1I/AAAAAAAAHrg/x9PqLyK3UyU/Blight.png') no-repeat;
}
.Empire {
    background: url('http://lh4.googleusercontent.com/_qvhVKLFln2A/TaByd1_QiPI/AAAAAAAAHrw/lM-q4qzVlws/Empire.png') no-repeat;
}
.Ravens_End {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaByhdmXzdI/AAAAAAAAHsY/-jaHa-qxi5o/Ravens-End.png') no-repeat;
}
.Ascension {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaBybCK4HiI/AAAAAAAAHrU/l1GMlNMkLI0/Ascension-1.png') no-repeat;
}
.Passage_to_Darkness {
    background: url('http://lh5.googleusercontent.com/_qvhVKLFln2A/TaByg2TVvXI/AAAAAAAAHsU/hJ4f-Bql0GY/Passage-To-Darkness.png') no-repeat;
}


/* --- Abilities Icons --- */

.enabling,
.activated,
.activated_nature, 
.activated_frost, 
.activated_shadow, 
.activated_fire,
.interval,
.interval_nature,
.interval_frost,
.interval_shadow,
.interval_fire,
.passive,
.passive_nature,
.passive_frost,
.passive_shadow,
.passive_fire,
.cast,
.cast_nature,
.cast_frost,
.cast_shadow,
.cast_fire {
	display:inline-block;
	height:20px;
	width:20px;
}

.N,
.B,
.S,
.R,
.L {
    display:inline-block;
	height:14px;
	width:14px;
}
.enabling {
    background: url('../photos/enabling.jpg') no-repeat;    
}
.activated {
	background: url('../photos/activated.jpg') no-repeat;
}
.activated_nature {
	background: url('../photos/activated_n.jpg') no-repeat;
}
.activated_frost {
	background: url('../photos/activated_o.jpg') no-repeat;
}
.activated_shadow {
	background: url('../photos/activated_s.jpg') no-repeat;
}
.activated_fire {
	background: url('../photos/activated_r.jpg') no-repeat;
}
.interval {
	background: url('../photos/interval.jpg') no-repeat;
}
.interval_nature {
	background: url('../photos/interval_n.jpg') no-repeat;
}
.interval_frost {
	background: url('../photos/interval_o.jpg') no-repeat;
}
.interval_shadow {
	background: url('../photos/interval_s.jpg') no-repeat;
}
.interval_fire {
	background: url('../photos/interval_r.jpg') no-repeat;
}
.passive {
	background: url('../photos/passive.jpg') no-repeat;
}
.passive_nature {
	background: url('../photos/passive_n.jpg') no-repeat;
}
.passive_frost {
	background: url('../photos/passive_o.jpg') no-repeat;
}
.passive_shadow {
	background: url('../photos/passive_s.jpg') no-repeat;
}
.passive_fire {
	background: url('../photos/passive_r.jpg') no-repeat;
}
.cast {
	background: url('../photos/spell.jpg') no-repeat;
}
.cast_nature {
	background: url('../photos/spell_n.jpg') no-repeat;
}
.cast_frost {
	background: url('../photos/spell_o.jpg') no-repeat;
}
.cast_shadow {
	background: url('../photos/spell_s.jpg') no-repeat;
}
.cast_fire {
	background: url('../photos/spell_r.jpg') no-repeat;
}
.N {
	background: url('../photos/N.jpg') no-repeat;
}
.B {
	background: url('../photos/O.jpg') no-repeat;
}
.S {
	background: url('../photos/S.jpg') no-repeat;
}
.R {
	background: url('../photos/R.jpg') no-repeat;
}
.L {
	background: url('../photos/1.jpg') no-repeat;
}