/* CSS Document */

/* BASIC =====================================================================*/
body {behavior:url('csshover.htc');}

body {background:#ffffff url('img/page_bg.png') left top repeat-y;}
body {font-family: 'Trebuchet MS','Segoe UI'; font-size:13px; line-height:20px;text-align:center;}
body,code,div,h1,h2,h3,h4,h5,h6,img,li,ol,span,table,th,td,ul {padding:0px; margin:0px; border:0px;}

/* links */
a 				{color:#03659F; text-decoration:none;}
a:hover 		{color:#ff0000; text-decoration:underline;}

/* headings etc. */
h1,h2,h3,h4,h5,h6 {margin-bottom: 10px; margin-top: 15px; letter-spacing:-1px; font-family:Calibri}
h1 {font-size:28px; color:#fff; margin-bottom:20px; text-align:left; padding-left:20px;}
h1 a {color:#fff;}
h1 strong {color: #ffffff;}
h2 {font-size:20px; color:#0277B6; margin-bottom:25px;}
h3 {font-size:17px}
h3 a {color:#000}
h4 {font-size:13px}

/* paragraphs */
p {line-height:20px; margin-bottom:10px;margin-top: 0px;}
p.main {margin-top:20px;}
p.top {margin-top:10px;}

/* tables */
table {border-collapse: collapse}
th,td {font-size: 11px;}

/* lists */
ul,ol,li    {list-style: none;}
ul          {margin-bottom: 10px;}

/* other */
hr        {border:0px; border-top:2px solid #cccccc; height:0px; margin-top:20px;margin-bottom:20px}
hr.cleaner {border:0px; clear:both; height:0px; margin:0px; padding:0px; visibility:hidden;}
hr.left {clear:left;}
hr.right {clear:right;}
hr.line {border-bottom:1px solid #F0F0F0;margin-bottom:10px; visibility:visible;}
img         {border:0px;}
sub, sup {position:relative; vertical-align:baseline;}
sub {top:0.4em;}
sup {bottom:0.4em;}

/* alignment */
.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.middle {vertical-align:middle;}
.top {vertical-align:top;}

/* GRID PARTS ================================================================*/
div#sidebar {float:left; width:190px;}
div#main 	{padding-top:3px; margin-left:220px; text-align:left}

#menu {font-size:13px; text-align:left; padding-left:20px}
#menu a {color:#fff;}
#menu a.active {color:lightblue; font-weight:bold}
#menu a:hover {color:lightblue}

#author {font-size:9px; margin:0px auto; margin-top:30px; text-align:left; padding-left:20px; padding-right:20px}
#author *{color:#888; font-weight: bold;}
#author p.mini {line-height:15px; margin-bottom:0px;}
#author hr {border-top:1px solid #555;}

.login 			{font-size:10px; font-weight:bold; text-transform: uppercase; text-align:left; padding:8px 24px 8px 20px; margin:0px 0px 0px -20px; background:lightgreen}
.login a 		{font-size:14px; font-weight:bold; color:#000}
.login p 		{margin:0px}
.login span		{font-size:11px}
.not-logged 	{background:#FF9999;font-size:10px; font-weight:bold; text-transform: uppercase}
.not-logged input.field	{width:100%}

/* confirm boxes */
div.confirm 	{background:#E0FFC0 url('img/ok.gif') 10px 7px  no-repeat; font-size:12px; font-weight:bold;}
div.confirm 	{line-height:18px; margin-bottom:20px; padding:10px; padding-left:45px; text-align:left;}
div.red 		{background-color:#fce8e8; background-image:url('img/nok.gif');}
div.blue 		{background-color:#CCFFFF; background-image:url('img/download.gif');}

/* */
li.coins {margin-left: 0px; padding-left: 30px;background: url('img/coins.png') no-repeat 5px 3px;}


/* table - overview */
/* TABLES ====================================================================*/
table {}
table th,
table td {padding:2px; padding-left:8px; padding-right:8px; text-align:left; font-size:12px; border:1px solid #dddddd}

table.overview {border-bottom:1px solid #E0E0E0; margin:0px; margin-bottom:20px;}
table.overview th,
table.overview td {background:#ffffff; border-top:1px solid #E0E0E0; padding:3px; padding-right:6px; padding-left:6px;text-align:left; font-size:11px;}
table.overview td.hidden {border-top:0px; padding-top:0px; padding-right:0px; padding-left:10px;}
table.overview th {background-color:#efefef; text-align:center}
table.overview tr.up td {background-color:ghostwhite;}
table.overview tr:hover td {background-color:honeydew;}
table.overview a {margin-right:7px; color: #000000}
table.overview img {vertical-align:middle}
table.overview td.center {text-align:center;}

table.overview tr.name td * {font-size:15px; color:#0277B6;} 
table.center td {text-align:center}

table.fit {width:100%}

table.overview tr.abilities td {background-color:#D7DEE5}
table.overview tr.ha-link td {font-size:18px;height:50px;text-align:center;}
table.overview tr.ha-link td a {color:red}

table.abilities {width:400px;margin:10px auto; border:0px}
table.abilities th {margin:0px;padding:0px;border:0px}
table.abilities td {font:10px Verdana, Arial, Helvetica, sans-serif; border:0px}
table.abilities td.title {font-weight:bold}
table.abilities td.value {text-align:right; padding-right:10px}
table.abilities td {background-color:#D7DEE5}
table.abilities tr.colored td {background-color:#EEEEEE}

table.abilities tr.title td {background-color:#CCCCCC; font-weight:bold; border-bottom:5px solid #D7DEE5; border-top:10px solid #D7DEE5}
table.abilities tr.name td {background-color:#253F69; color:#fff; text-align:center; font-weight:bold; border-bottom:5px solid #D7DEE5; border-top:10px solid #D7DEE5}

strong.card-name {font-size:15px}

/* form ==================== */
table.form	{margin-bottom:20px;}

/* button */
input.submit 			{background:url('button.png') top left no-repeat; border:0px; cursor:pointer; font-weight:normal; height:30px; width:100px;}
input.submit:hover,
input.submit:focus 		{ background-position: 0px -30px;}

/* link with image */
a.img 							{padding-top:2px; padding-bottom:2px; text-decoration:underline;}
a.img:hover							{color:#ff0000;}

/* colors */
.green	{color:#00CC00}
.red 	{color:#FF0033}

/* match */
tr.win td {background-color:#CCFFCC}
tr.draw td {}
tr.loss td {background-color:#FFD9FF}

/* changelog*/
span.changelog-info,
span.changelog-new,
span.changelog-fixed,
span.changelog-removed {font-size:11px}

span.changelog-info {color:deeppink}
span.changelog-new {color:green}
span.changelog-fixed {color:blue}
span.changelog-removed {color:red}