@CHARSET "UTF-8";

/*
 * Map editor
 */

.loc {float: left; width: 16px; text-align: center; height:16px; background: #eeeeee; margin: 0px; padding: 1px; border: 1px solid black; font-size: 10px; font-weight: bold; padding-left: 1px;}
.new {background: silver;}
div.L_N   {border-top: 1px dotted gray;}
div.L_S   {border-bottom: 1px dotted gray;}
div.L_W   {border-left: 1px dotted gray;}
div.L_E   {border-right: 1px dotted gray;}
div.L_U   {background: crimson;}
div.L_D   {background: blue;}

div.L_A   {background: purple;}

/*
 * Progress bar
 */

.progressbar {display: block; width: 100px; border: 1px solid gray; padding: 1px;}
.progressbar span {display: block;height: 3px; background-color: silver;}

/*
 * Journal
 */

.notification { padding: 0px 0px 0px 6px; margin: 0px 0px 5px 0px;}
.not_new  { border-left: 3px double blue; }
.not_seen { border-left: 3px double gray; }
.notification.title { color: black; }

/*
 * Materials
 */

.mat_holder {
	width: 48px;
	height: 48px;
	background: center;
	float: left;
	margin: 1px;
	position: relative;
}

.mat_holder span {
	color: red;
	position: absolute;
	bottom: 5px;
	right: 5px;
	font-weight: bold;
}


/*
 * Dialogue
 */

a.dialogue {text-decoration: none;}
a.dialogue:hover {text-decoration: underline;}

/*
 * Conditions
 */

.condition {width: 100%; margin: 5px;}
.condition img {width: 32px; float: left;}
.condition div {float: left; padding-left: 5px;}
.condition span {float: right; color: gray;}

.condition_info {width: 300px;}

/*
 * Arcane net
 */

.net_divider {float: left; width: 50px;}
div.net_padded  {padding: 5px;}
.stat_helper {margin-left: 15px; float: left; width: 340px; margin-bottom: 3px;}
.stat_header {margin-bottom: 3px;}

.quest { width: 600px; border: 1px solid #ccc; padding: 1px; margin: 1px; }
.quest img {float: left;}
.quest_stats  { width: 500px; float: left; margin-left: 10px; min-height: 66px; position: relative;}
.quest_title  { margin-bottom: 2px;}
.quest_status {font-size: 90%; margin-top: 3px;}
.quest_helper {font-size: 75%;}
.quest_stats_bottom {text-align: center; font-size: 75%; position: absolute; bottom: 0px; width: 100%}


/*
 * Skills
 */
.wiki_link  {float:right; padding-right: 10px;}

.stat { margin-top: 2px;}
.stat_title {margin-left: 15px; float: left; width: 200px;}
.stat_aligned {position: relative; top: 3px; width: 140px;}
.stat_exp   {margin-left: 15px; float: left;}
.exp_level  {margin-right: 5px; float: right;}
.stat_level {margin-right: 5px; float: right; width: 25px;}
.profile_table .table_item:nth-child(2n) {background: #ededed;}
.table_item:nth-child(2n):hover, .table_item:hover, .table_row:hover {background: #ddddff;}
.table_row.stat {height: 21px;}

.skill_img  {float: left; width: 32px; margin-right: 10px;}

.physical {color: gray;}
.poison {color: green;}
.fire {color: red;}
.cold {color: blue;}
.energy {color: purple;}

/*
 * Inventory
 */

.slot_list {float: left; width: 400px; position: relative; height: 400px; }
.item_list {float: left; margin-top: 10px; text-align: left;}

.slot { width: 48px; height: 48px; font-size: 75%; position: absolute; text-align: center; font-weight: bold; border: 1px solid black; background: silver;}
.item { width: 350px; border: 1px solid #ccc; padding: 1px; margin: 1px; }
.item img {float: left;}
.item_stats {float: left; margin-left: 3px; width: 275px; min-height: 66px; position: relative;}
.item_title {text-align: center;}
.item_status {text-align: center; font-size: 75%;}
.item_use    {font-size: 75%;}
.item_stats_bottom {text-align: center; font-size: 75%; position: absolute; bottom: 0px; width: 100%}

div.equipped { background: #efefef; border: 1px solid black;}

span.rare_0 {color: gray;}
span.rare_1 {color: black;}
span.rare_2 {color: green;}
span.rare_3 {color: blue;}
span.rare_4 {color: red;}
span.rare_5 {color: violet;}
span.rare_6 {color: gold;}

/*
 * Profile
 */

.profile_main {min-height: 550px; background-position: left top; background-repeat: no-repeat;}

.Dr_M { background-image: url("../Img/Races/Drake-M.jpg");}
.Dr_F { background-image: url("../Img/Races/Drake-F.jpg");}
.Na_M { background-image: url("../Img/Races/Naga-M.jpg");}
.Na_F { background-image: url("../Img/Races/Naga-F.jpg");}
.Hu_M { background-image: url("../Img/Races/Human-M.jpg");}
.Hu_F { background-image: url("../Img/Races/Human-F.jpg");}
.Me_M { background-image: url("../Img/Races/Elf-M.jpg");}
.Me_F { background-image: url("../Img/Races/Elf-F.jpg");}
.Un_M { background-image: url("../Img/Races/Unknown-M.jpg");}
.Un_F { background-image: url("../Img/Races/Unknown-F.jpg");}

.profile_container {float: right; margin-top: 5px; margin-bottom: 10px; font-size: 10pt;}
.profile_header    {padding: 2px; width: 390px; background-color:#E8E8E8; font-size:105%; border: 1px solid gray; border-bottom: 0px none;}
.profile_item      {padding: 2px; width: 390px;  border: 1px solid gray; background: white;}
.profile_add       {padding: 2px; width: 390px;  border: 1px solid gray; background: white; border-top: 0px none;}

.red    {color: red;}
.green  {color: green;}
.blue   {color: blue;}
.violet {color: purple;}

/*
 * WHO
 */

.who_item  {text-align: center; margin: 0 auto 0 auto;}
.who_level {float: left; width: 49%; margin-right: 5px; text-align: right;}
.who_name  {float: left;}

/*
 * Location
 */

.loc_title       {font-weight: bold; text-align: center;}
.loc_status      {font-size: 11px; text-align: center;}
.loc_map         {position: absolute; right: 30px; top: 40px; width: 69px; height: 92px;}
.loc_description {margin-right: 100px; margin-top: 10px; margin-bottom: 10px; min-height: 75px;}

.map_cell	 {position: absolute; width: 23px; height: 23px;}
.loc_map .N  {left: 24px; top:  0px;}
.loc_map .S  {left: 24px; top: 48px;}
.loc_map .W  {left:  0px; top: 24px;}
.loc_map .E  {left: 48px; top: 24px;}
.loc_map .C  {left: 24px; top: 24px;}
.loc_map .U  {left:  0px; top:  0px; background: url(../Img/Arrows/arr_u.gif) no-repeat center;}
.loc_map .D  {left: 48px; top: 48px; background: url(../Img/Arrows/arr_d.gif) no-repeat center;}
.loc_map .AP {left:  0px; top: 72px; width: 69px;}


.loc_map .loc {float: left; width: 20px; height:20px; background:none repeat scroll 0 0 #eeeeff; text-align: center; cursor: pointer; margin: 0px; padding: 1px; border: 1px solid black;}
.loc_map .new {background: silver;}
.loc_map div.L_N   {border-top: 1px dotted gray;}
.loc_map div.L_S   {border-bottom: 1px dotted gray;}
.loc_map div.L_W   {border-left: 1px dotted gray;}
.loc_map div.L_E   {border-right: 1px dotted gray;}

.api_error {background:#fffceb; border:1px solid #d9d9d9; width: 80%; margin:8px 3px 8px 3px;  padding:3px 8px 3px 8px;}
.api_form  {background:#ebfcfc; border:1px solid silver; margin:8px 5px 8px 5px;  padding:5px 8px 5px 8px;}

.helper_div {margin-top: 10px; margin-left: 5px; padding-left: 7px; border-left: 4px double silver;}

.panel_item_use  {position: absolute; width: 40px; top: 10px; left: -40px;}
.panel_skill_use {position: absolute; width: 40px; top: 10px; right: -50px;}
.skill_holder, .skill_cooldown {margin-bottom: 3px;}

/**
 * Chat
 */
input.chatText {width: 400px; height: 18px;}
input.chatButton {width: 100px;}

.chatPanel {float: left;}
.chatTarget {float: right;}
.chatTarget span {color: blue; font-weight: bold;}
.chatAdd {margin: 0px 0px 2px 5px; line-height: 12px;}
.chatAdd a {font-size: 80%;}

.charBorder {border: 1px solid black;height: 304px; padding: 1px 0px 1px 0px;}
.chatWnd  {float: left; width: 545px; height: 300px; overflow-y: scroll; overflow-x: visible; padding-right: 2px; border-right: 1px solid silver;}
.chatList {overflow-y: scroll; float: right; width: 230px; height: 300px; overflow-y: none; overflow-x: visible;}
.chatInnerText {padding: 2px 15px 2px 15px;}

.chatHero .active {color: blue; font-weight: bold;}
.chatName .active {font-weight: bold;}

.name {font-weight: bold; color: blue;}
.self {font-weight: bold; color: red;}

/**
 * Game
 */

.char_name {color: silver; float: right;}
.cycle_name {float: left;}
.cycle_name.cycle_0 {color: blue; }
.cycle_name.cycle_1 {color: gray; }
.cycle_name.cycle_2 {color: olive; }
.cycle_name.cycle_3 {color: purple; }

.char_name:hover {color: black;}
.tag_img {width: 16px; height: 16px;}

/*
 Link button
 ------------------------------------------*/

a.button {color: #439012; text-decoration: none; margin-bottom: 2px; border-bottom: 1px solid #DCE7E0; text-align: center; display: block; width: 124px; padding: 3px;}
a.button:hover  {background: #E1E8DA;}

.button.spinnered,.button.spinnered:hover {background: #FFFFFF url(../Img/spinner.gif) left no-repeat; padding-left: 10px; color: gray;}
 

.button_list {text-align: center; padding: 5px 10px 0px 10px;}
.button_list .button {margin-left: 15px; margin-right: 15px; float: left;}

.api_button {float: right; position: relative; top: -10px; right: -15px;}

/*
 jQuery ajax forms
 ------------------------------------------*/
.jquery_error {background:#fffceb; border:1px solid #d9d9d9; width: 80%; margin:0px 17px 8px 17px;  padding:3px 8px 3px 8px;}
.jquery_text  {padding:3px 0px; margin: 0px 19px 7px 19px; color:#808080}

.jquery_title {width: 120px; float: left;}