/*
 * Baseline for the markup that still uses the original page structure (its class names and ids: div#build,
 * div.reports, table#overview, .none, ...). WV02: replaces the original stylesheets (compact.css and lang.css
 * under web/public/legacy, outside git) so that a version can be rebuilt from git alone. Only the rules our pages
 * still use, with the look they gave; no images (pictures come from public/assets through assets.ts). It lives in
 * public/ and is linked from index.html so that it stays the FIRST stylesheet, unbundled, as the original's were (a
 * bundled copy would load after the shared chunks' CSS and override them): theme.css, shell.css, app.css and the page
 * styles override it. Don't add new rules here: style new markup with hf-* classes.
 * VIS29: the original's text colours that read below 3:1 on our parchment (link green #71d000, orange #ff8000, grey
 * #c0c0c0) are replaced by the theme's deep green, a dark orange and the soft ink (fallbacks for pages without theme.css).
 */

/* ---- elements ---- */
html, body { height: 100%; }
/* VIS24: the `font` shorthand resets font-variant-numeric, so the lining figures of html (VIS12) are set again here */
body { margin: 0; background: #fff; color: #000; font: 13px/normal Verdana, Arial, Helvetica, sans-serif; font-variant-numeric: lining-nums; overflow-y: scroll; }
img { border: 0; }
h1, h2, span, form, img, li { margin: 0; padding: 0; }
h1 { margin-bottom: 8px; font-size: 24px; }
h2 { font-size: 18px; }
p { margin: 20px 0; padding: 0; }
label { white-space: nowrap; }
img, a, div { background-position: left top; background-repeat: no-repeat; }
a { color: var(--hf-green-deep, #3f6226); font-weight: bold; text-decoration: none; }
a:visited { color: var(--hf-green-deep, #3f6226); }
a:active { color: #a34a00; }
a:hover { color: var(--hf-ink, #2b1d12); text-decoration: underline; }
/* VIS35: the original's small Verdana fields get the kit's parchment look (ui.css .hf-input) and a gold focus ring */
input.text, select.dropdown, textarea {
  margin: 0; padding: 3px 6px; font: inherit; color: var(--hf-ink, #2b1d12); background: var(--hf-parchment-light, #fbf5e6);
  border: 1px solid var(--hf-parchment-line, #cdb685); border-radius: 3px;
}
input.text:focus, select.dropdown:focus, textarea:focus { outline: none; border-color: var(--hf-gold, #d9ab3c); box-shadow: 0 0 0 2px rgba(217, 171, 60, 0.35); }
input.disable, input.disabled { background-color: #eee; border-color: #aaa; }

/* ---- tables: 1 px cell spacing on a grey table background draws the grid (UI#70: not for the tables in the game design, table.css; :where keeps the specificity of the original rules) ---- */
table:where(:not(.hf-table)) { margin: 0; width: 100%; background-color: #c0c0c0; border-collapse: separate; empty-cells: show; line-height: 16px; }
table:where(:not(.hf-table)) td, table:where(:not(.hf-table)) th { padding: 0; vertical-align: middle; font-size: 13px; font-weight: normal; }
table:where(:not(.hf-table)) thead th, table:where(:not(.hf-table)) tfoot th { background: #e6e6e6 linear-gradient(#fafafa, #d2d2d2); text-align: center; font-weight: bold; }
table:where(:not(.hf-table)) thead td, table:where(:not(.hf-table)) tfoot td { background-color: #f3f3f3; text-align: center; }
table:where(:not(.hf-table)) tbody th, table:where(:not(.hf-table)) tbody td { background-color: #fff; text-align: left; }
table:where(:not(.hf-table)) tr.hl th, table:where(:not(.hf-table)) tr.hl td { background-color: #f0fff0; border-top: 1px solid var(--hf-green-deep, #3f6226); border-bottom: 1px solid var(--hf-green-deep, #3f6226); }
table:where(:not(.hf-table)) tr.hl th.fc, table:where(:not(.hf-table)) tr.hl td.fc { border-left: 1px solid var(--hf-green-deep, #3f6226); }
table td.empty { height: 5px; padding: 0; }
table.row_table_data:where(:not(.hf-table)) tr.marked td { background-color: #fff8dc; }
td.aligned_coords { padding: 2px 0; white-space: nowrap; width: 84px; }
td.aligned_coords div { float: left; }
td.aligned_coords div.cox { text-align: right; width: 38px; }
td.aligned_coords div.pi { text-align: center; width: 8px; }
td.aligned_coords div.coy { text-align: left; width: 38px; }

/* ---- utility classes ---- */
.hide { display: none; }
div.clear { clear: both; height: 0; width: 0; }
.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.middle { vertical-align: middle; }
.b { font-weight: bold; }
.t { font-weight: normal; }
.e { color: #a34a00; }
.c, .none { color: var(--hf-ink-soft, #5c4630); }
.error { color: red; margin-top: 10px; }
.p2 { border: 1px dashed #c0c0c0; padding: 3px; }
span.dur { white-space: nowrap; }
img.unit { width: 16px; height: 16px; }
div#textmenu { margin: 14px 0; font-size: 13px; font-weight: normal; }
div#textmenu span { color: var(--hf-ink-soft, #5c4630); font-weight: bold; }
div#textmenu a.selected { border-bottom: 1px dashed silver; }
div#textmenu.rpt-readall { text-align: right; }

/* ---- page boxes (inside the game they sit in a window: app.css) ---- */
div#content { float: left; min-height: 450px; overflow: hidden; position: relative; }
div#content.reports, div#content.build { overflow: auto; }
div.player, div.alliance, div.forum, div.statistics, div.reports, div.a2b, div#build { padding: 43px 25px 0; width: 502px; }
div.map { padding: 43px 0 0; width: 552px; }
div.village1 { padding: 43px 0 0 15px; width: 537px; }
div.build { width: 552px; }

/* village overview (only the error box of the game layout still uses it) */
div.village1 h1 { height: 29px; left: 10px; position: relative; z-index: 500; }
div.village1 h1 div { float: left; }
div.village1 table:where(:not(.hf-table)) { background-color: #fff; line-height: 19px; }
div.village1 table:where(:not(.hf-table)) thead th { background-color: #fff; text-align: left; }
div.village1 table tbody td { padding: 1px 2px; }
div.village1 table td.ico { padding-left: 4px; width: 18px; }
div.village1 table td.num { text-align: right; white-space: nowrap; font-weight: bold; }
div.village1 table#building_contract { clear: both; margin: 0 25px; width: 502px; }

/* ---- building windows (div#build) ---- */
div#build p.switch { text-align: right; }
div#build h2 { margin: 15px 0 10px; }
div#build p.build_desc { padding-right: 70px; }
div#build p#contract { line-height: 19px; }
div#build table#build_value:where(:not(.hf-table)) { background-color: #fff; line-height: 19px; width: auto; }
div#build table#build_value th, div#build table#build_value td { white-space: nowrap; }
div#build table#build_value th { padding-right: 35px; }
div#build table#build_value td { text-align: right; }
div#build table.build_details td { padding: 2px 7px; }
div#build table.build_details td.desc { line-height: 19px; }
div#build table.build_details td.desc span.info { font-size: 11px; }
div#build table.build_details td.desc div.tit img { margin: 0 5px; position: relative; top: 3px; }
div#build table.build_details td.desc div.details { padding-left: 30px; }
div#build table.build_details td.desc div.details span { white-space: nowrap; }
div#build table.build_details td.desc div.details span.none { white-space: normal; }
div#build table.build_details td.act { text-align: center; width: 29%; }
div#build table.build_details td.val { text-align: center; width: 12%; }
div#build table.build_details td.val input.text { width: 30px; }
div#build table.build_details td.max { text-align: center; width: 12%; font-size: 10px; }
div#build table.under_progress { margin-top: 15px; }
div#build table.under_progress td { padding: 2px 7px; text-align: center; }
div#build table.under_progress td.desc { text-align: left; }
div#build table.under_progress td.desc img { margin: 0 5px; position: relative; top: 3px; }
div#build table.under_progress td.desc span.info { color: var(--hf-ink-soft, #5c4630); font-size: 11px; }
div#build table.under_progress div.val { float: left; padding-left: 5px; text-align: right; }
div#build table.under_progress td.dur, div#build table.under_progress td.fin { width: 20%; }
div#build table.under_progress:where(:not(.hf-table)) tr.next td { background-color: #f5f5f5; }
div#build table#expansion td, div#build #expansion th { padding: 2px 7px; }
div#build table#expansion thead td { padding: 2px; }
div#build table#expansion td { text-align: center; }
div#build table#expansion td.ra { text-align: right; white-space: nowrap; width: 2%; }
div#build table#expansion td.vil { text-align: left; }
div#build table#expansion td.ha { width: 16%; }
div#build table#expansion td.dat { white-space: nowrap; width: 14%; }
div#build.gid0 h1 { margin-bottom: 25px; }
div#build.gid0 h2 { margin-bottom: 15px; }
div#build.gid0 div.hide { display: none; }
div#build.gid0 table.new_building { background-color: #fff; margin-bottom: 25px; }
div#build.gid0 table.new_building td.desc { padding-bottom: 15px; }
div#build.gid0 table.new_building td.bimg { padding-left: 15px; padding-right: 5px; vertical-align: top; }
div#build.gid0 table.new_building td.res { padding-bottom: 3px; }
div#build.gid0 table.new_building td.requ { padding-bottom: 3px; font-weight: bold; }

/* ---- per-building windows (div#build.gid<type>) ---- */
div#build.gid15 h2 { margin-top: 25px; }
div#build.gid15 select.dropdown { width: 200px; }
div#build.gid16 div#textmenu { position: relative; white-space: nowrap; }
div#build.gid16 div#textmenu a { background-color: #fff; }
div#build.gid16 h4 { margin-top: 20px; }
div#build.gid16 table.troop_details { margin-bottom: 15px; }
div#build.gid17 table#range { margin-top: 20px; }
div#build.gid17 p.info { margin-top: 5px; }
div#build.gid17 p.info img { margin-right: 2px; }
div#build.gid26 table#main { margin-top: 15px; }
div#build.gid27 table#near { margin-top: 20px; }
div#build.gid40 p.build_desc { padding-right: 200px; }
div#build.gid40 p.nam { text-align: center; }
div#build.gid15 table#demolish { background-color: #fff; }
div#build.gid16 table.troop_details th, div#build.gid16 table.troop_details td { padding: 2px 7px; }
div#build.gid16 table.troop_details th { width: 20%; }
div#build.gid16 table.troop_details tbody.units td { padding: 2px; text-align: center; width: 7.2%; }
div#build.gid16 table.troop_details:where(:not(.hf-table)) tbody.infos th, div#build.gid16 table.troop_details:where(:not(.hf-table)) tbody.infos td { background-color: #f3f3f3; }
div#build.gid16 table.troop_details tbody.goods td { padding: 2px; width: 7.2%; }
div#build.gid16 table.troop_details tbody.goods div.res { text-align: left; white-space: nowrap; }
div#build.gid16 table.troop_details tbody.goods div.carry { text-align: right; }
div#build.gid16 table.troop_details div { float: left; text-align: center; width: 50%; }
div#build.gid16 table.troop_details div.small { width: 45%; }
div#build.gid16 table.troop_details div.sup { text-align: left; }
div#build.gid16 table.troop_details div.sback { text-align: right; }
div#build.gid16 table.troop_details div.free { text-align: right; }
div#build.gid17 table#range th, div#build.gid17 table#range td { padding: 2px; text-align: center; }
div#build.gid17 table#range tfoot td { padding-right: 7px; text-align: right; }
div#build.gid17 table#range td.val { text-align: left; white-space: nowrap; width: 16%; }
div#build.gid17 table#range td.dur { white-space: nowrap; width: 13%; }
div#build.gid17 table#range td.act { width: 35%; }
div#build.gid17 table#summary th, div#build.gid17 table#summary td { padding: 2px 7px; }
div#build.gid17 table#summary td.desc { background-color: #f3f3f3; text-align: center; }
div#build.gid17 table#summary td.ico { padding-right: 2px; width: 5%; }
div#build.gid17 table#summary td.val { padding-left: 2px; white-space: nowrap; width: 16%; }
div#build.gid17 table#sell { background-color: #fff; }
div#build.gid17 table#sell th, div#build.gid17 table#sell td { padding: 2px; }
div#build.gid17 table#sell th { width: 10%; }
div#build.gid17 table#sell input.check { position: relative; top: 1px; }
div#build.gid17 table#sell select.dropdown { padding: 1px; }
div#build.gid17 table#sell td.val { width: 13%; }
div#build.gid17 table#sell td.val input.text { width: 50px; }
div#build.gid17 table#sell td.res { width: 20%; }
div#build.gid17 table#sell td.res input.text { width: 75px; }
div#build.gid18 table { width: 60%; }
div#build.gid18 table th, div#build.gid18 table td { padding: 2px 7px; }
div#build.gid18 table th { width: 30%; }
div#build.gid18 table#join th, div#build.gid18 #join td { text-align: center; }
div#build.gid18 table#join td.nam { width: 30%; }
div#build.gid18 table#found td.tag input.text { width: 80px; }
div#build.gid18 table#found td.nam input.text { width: 160px; }
div.build.gid22 table#researchFuture td.desc { vertical-align: top; white-space: nowrap; width: 40%; }
div.build.gid22 table#researchFuture td.cond { line-height: 19px; }
div#build.gid24 table.build_details td.desc div.details { padding-left: 0; }
div#build.gid26 table#main { margin-top: 15px; }
div#build.gid26 table#main th, div#build.gid26 #main td { padding: 2px 7px; }
div#build.gid26 table#main tbody th { width: 50%; }
div#build.gid26 table#main td.desc { text-align: center; }
div#build.gid26 table#main input.text { width: 94%; }
div#build.gid27 table#near { margin-top: 20px; }
div#build.gid27 table th, div#build.gid27 table td { padding: 2px 7px; text-align: center; }
div#build.gid27 table td.nam { text-align: left; }
div#build.gid27 table td.pla { width: 20%; }
div#build.gid27 table#own td.vil { width: 20%; }
div#build.gid27 table#own td.cap { width: 25%; }
div#build.gid35 table.build_details td.desc div.details { padding-left: 0; }
div#build.gid37 table th, div#build.gid37 table td { padding: 2px 7px; }
div#build.gid37 table td.nam { text-align: left; width: 30%; }
div#build.gid37 table#rename { width: 60%; }
div#build.gid37 table#rename tbody th { width: 40%; }
div#build.gid37 table#rename input.text { width: 94%; }
div#build.gid37 table#oases td { text-align: center; }
div#build.gid37 table#oases thead td { padding: 2px; }
div#build.gid37 table#oases td.nam img { position: relative; top: 1px; }
div#build.gid37 table#leave thead td { padding: 2px; }
div#build.gid37 table#leave tbody td { text-align: center; }
div#build.gid40 table#rename { width: 50%; }
div#build.gid40 table#rename th, div#build.gid40 table#rename td { padding: 2px 7px; }
div#build.gid40 table#rename td { text-align: center; }
div#build.gid40 table#rename tbody th { width: 25%; }
div#build.gid40 table#rename input.text { width: 94%; }
div#build.gid16 h4 { font-size: 13px; font-weight: bold; }
div#build.gid16 p.info a { color: black; font-size: 21px; font-weight: bold; }
div#build.gid16 table.troop_details:where(:not(.hf-table)) thead a { color: black; }
div#build.gid17 div.error, div#build.gid17 p.error { font-weight: bold; }
div#build.gid17 p.note { color: #228b22; font-weight: bold; }
div#build.gid17 p.info { font-size: 11px; }
div#build.gid18 table#found span.error { font-size: 11px; }
div#build.gid26 table#main td.desc { font-size: 11px; }
div#build.gid27 table div.info { font-size: 11px; }
div#build.gid27 table#own td.inactive, div#build.gid27 table#own td.inactive a { color: var(--hf-ink-soft, #5c4630); }
div#build.gid40 p.info { color: var(--hf-ink-soft, #5c4630); font-size: 11px; }
div#build.gid40 p.nam { font-size: 27px; }

/* ---- map window ---- */
div.map h1 { margin-left: 25px; }
div.map h1 div { float: left; }
div#map { position: relative; }
div.map div#map { height: 375px; top: -26px; width: 552px; }
div.map table#options { clear: both; margin: 0 25px; width: 502px; }
div.map table#options tbody td { padding-left: 4px; }
div#map table.default, div#map table.empty, div#map table.oasis_empty { background-color: #f0f0f0; }
div#map table.village, div#map table.oasis { background-color: #c0c0c0; }
div#map table.default thead th, div#map table.empty thead th, div#map table.oasis_empty thead th { background-color: #fff; }
div#map table.empty thead th, div#map table.oasis_empty thead th, div#map table.oasis thead th { font-style: italic; font-weight: normal; }
div#map table.default th, div#map table.default td, div#map table.empty th, div#map table.empty td,
div#map table.oasis_empty th, div#map table.oasis_empty td { color: var(--hf-ink-soft, #5c4630); }

/* ---- send troops (div.a2b) ---- */
div.a2b .slots { margin: 5px 0 10px; }
div.a2b p.error { font-weight: bold; }
div.a2b span.info { font-size: 11px; }
div.a2b table th, div.a2b table td { padding: 2px 7px; }
div.a2b table#troops { margin-top: 5px; background-color: #fff; border: 1px dashed #c0c0c0; }
div.a2b table#troops td { font-size: 11px; }
div.a2b table#troops td.large { width: 26%; }
div.a2b table#troops td.regular { width: 25%; }
div.a2b table#troops td.small { width: 23%; }
div.a2b table#troops img { bottom: 3px; margin-right: 2px; position: relative; vertical-align: bottom; }
div.a2b table#troops input.text { width: 30px; }
div.a2b table#troops span.none { font-weight: bold; }
div.a2b table#coords { margin: 25px 0 10px 5px; background-color: #fff; line-height: 18px; }
div.a2b table#coords td { padding: 0; vertical-align: top; }
div.a2b table#coords td.sel { white-space: nowrap; width: 35%; }
div.a2b table#coords td.sel input.radio { position: relative; top: 1px; }
div.a2b table#coords td.or { font-style: italic; }
div.a2b table#coords td.vil, div.a2b table#coords td.target { font-size: 18px; font-weight: bold; }
div.a2b table#coords td.vil *, div.a2b table#coords td.target * { float: left; margin-right: 10px; }
div.a2b table#coords td.vil input.text { width: 100px; }
div.a2b table#coords td.target input.text { width: 40px; }
div.a2b table.troop_details { margin: 15px 0; }
div.a2b table.troop_details thead td { font-weight: bold; }
div.a2b table.troop_details:where(:not(.hf-table)) thead td a { color: black; }
div.a2b table.troop_details tbody th { width: 20%; }
div.a2b table.troop_details tbody.units td { padding: 2px; text-align: center; width: 7.2%; }
div.a2b table.troop_details tbody.units input.text { width: 73%; }
div.a2b table.troop_details tbody.options input.radio { margin-right: 2px; position: relative; top: 2px; }
div.a2b table.troop_details:where(:not(.hf-table)) tbody.infos th, div.a2b table.troop_details:where(:not(.hf-table)) tbody.infos td { background-color: #f5f5f5; }
div.a2b table.troop_details tbody.infos div { text-align: center; width: 49%; }
div.a2b table.troop_details tbody.infos div.in { float: left; }
div.a2b table.troop_details tbody.infos div.at { float: right; }

/* ---- reports ---- */
.reports table { width: auto; min-width: 500px; }
div.reports table td, div.reports table th { padding: 2px 7px; }
div.reports .none { text-align: center; }
div.reports table#overview td, div.reports table#overview th { line-height: 17px; padding: 3px 7px; }
div.reports table#overview tbody td { vertical-align: top; }
div.reports table#overview thead th.sent { font-weight: bold; }
div.reports table#overview:where(:not(.hf-table)) thead th.sent a { color: black; }
div.reports table#overview td.sel { padding: 5px; text-align: center; width: 5%; }
div.reports table#overview td.sub img { float: left; }
div.reports table#overview td.sub div { padding-left: 24px; }
div.reports table#overview td.dat { padding: 3px 2px; text-align: center; white-space: nowrap; width: 23%; }
div.reports table#overview tfoot th.buttons { text-align: left; }
div.reports table#overview tfoot th.buttons input { vertical-align: middle; }
div.reports table#overview tfoot th.navi { text-align: right; color: var(--hf-ink-soft, #5c4630); font-weight: bold; }
div.reports table#report_surround thead th, div.reports table#report_surround thead td { text-align: left; }
div.reports table#report_surround thead td.sent { width: 25%; font-weight: bold; }
div.reports table#report_surround td.report_content { padding: 15px 2px 0; }
div.reports td.report_content table { margin-bottom: 15px; }
div.reports td.report_content thead td.role { font-weight: bold; }
div.reports td.report_content table#reinforcement:where(:not(.hf-table)) td.role, div.reports td.report_content table.defender:where(:not(.hf-table)) td.role { color: var(--hf-green-deep, #3f6226); }
div.reports td.report_content table#attacker:where(:not(.hf-table)) td.role { color: #a34a00; }
div.reports table#report_surround td.report_content table:where(:not(.hf-table)) thead td { background-color: #f3f3f3; text-align: center; }
div.reports table#report_surround td.report_content table tbody th { text-align: left; width: 20%; }
div.reports table#report_surround td.report_content table tbody.units td { padding: 2px; text-align: center; width: 7.2%; }
div.reports table#report_surround td.report_content table tbody.infos th,
div.reports table#report_surround td.report_content table tbody.infos td,
div.reports table#report_surround td.report_content table tbody.goods th,
div.reports table#report_surround td.report_content table:where(:not(.hf-table)) tbody.goods td { background-color: #f5f5f5; }
div.reports table#report_surround td.report_content table tbody.infos td img { display: inline; margin-right: 2px; }
div.reports td.report_content table#attacker tbody.goods div.res { float: left; }
div.reports td.report_content table#attacker tbody.goods div.carry { float: right; margin-left: 20px; }

/* ---- statistics ---- */
div.statistics h4 { color: #a34a00; font-size: 13px; font-weight: bold; }
div.statistics p.error { font-size: 9px; }
div.statistics table { margin-top: 5px; }
div.statistics table td, div.statistics table th { padding: 2px 7px; text-align: center; }
div.statistics td.ra { text-align: right; white-space: nowrap; width: 5%; }
div.statistics td.pop { width: 20%; }
div.statistics td.vil { width: 10%; }
div.statistics td.pla { width: 18%; }
div.statistics table#player td.pla, div.statistics table#player_off td.pla, div.statistics table#player_def td.pla { text-align: left; width: auto; }
div.statistics table#villages td.vil { text-align: left; width: auto; }
div.statistics table#villages td.pla { text-align: left; width: 25%; }
div.statistics table#villages td.hab { width: 15%; }
div.statistics table#villages td.aligned_coords { padding: 2px 0; }
div.statistics table#wonder td.nam { width: 35%; }
div.statistics table#wonder td.at { width: 2%; color: var(--hf-ink-soft, #5c4630); }

/* ---- player profile and account ---- */
div.player table { margin-top: 25px; }
div.player table#profile, div.player table#edit, div.player table#links { margin-top: 0; }
div.player table td, div.player table th { padding: 2px 7px; }
div.player tbody th { text-align: left; }
div.player td, div.player .none { text-align: center; }
div.player span.none3, div.player div#textmenu a.none { color: var(--hf-ink-soft, #5c4630); }
div.player td.note { font-size: 11px; }
div.player table#profile thead td { width: 50%; }
div.player table#profile td.details { border-bottom: none; height: 156px; padding: 0; vertical-align: top; width: 50%; }
div.player table#profile td.details table { background-color: #fff; border-collapse: collapse; margin-top: 0; }
div.player table#profile td.details table th { border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; width: 50%; }
div.player table#profile td.details table td { border-bottom: 1px solid #c0c0c0; text-align: left; }
div.player table#profile td.desc1 { padding: 0 7px; vertical-align: middle; width: 50%; }
div.player table#villages td.nam { text-align: left; }
div.player table#villages td.hab { width: 20%; }
div.player table#edit thead td { width: 50%; }
div.player table#edit tbody th { white-space: nowrap; width: 20%; }
div.player table#edit tbody td { line-height: 19px; }
div.player table#edit input.text { width: 94%; }
div.player table#edit td.desc1 { padding: 0; }
div.player table#edit td.desc1 textarea { overflow-x: hidden; overflow-y: scroll; padding: 0; text-align: center; height: 264px; width: 249px; font-size: 13px; }
div.player table.set td { text-align: left; }
div.player table.set td.sel { text-align: center; width: 5%; }
div.player table.set input.radio { position: relative; top: 1px; }
div.player table#links td.nam input.text { width: 150px; }
div.player table#links td.link input.text { width: 255px; }
div.player table#time tbody th { width: 25%; }
div.player table#time select.dropdown { width: 200px; }
div.player table.account tbody th { width: 50%; }
div.player table.account input.text { width: 50%; }
div.player table.account table.sitter { background-color: transparent; margin: 0; }
div.player table.account table.sitter td { padding: 0; vertical-align: top; }
div.player table.account table.sitter td.flags { text-align: left; }
div.player table.account table.sitter td.name { padding-bottom: 10px; }
div.player table.account td.container { padding: 0; width: 50%; }
div.player table.account span.count { margin-left: 5px; color: var(--hf-ink-soft, #5c4630); font-size: 10px; }
div.player table.account span.max { margin-left: 5px; color: red; font-size: 10px; }

/* ---- alliance ---- */
div.alliance .error { font-weight: bold; }
div.alliance table td, div.alliance table th { padding: 2px 7px; }
div.alliance tbody th { text-align: left; }
div.alliance td, div.alliance .none, div.alliance table td.none { text-align: center; }
div.alliance td.sel { width: 15%; }
div.alliance table#member, div.alliance table#own, div.alliance table#tip { margin-top: 25px; }
div.alliance table#rights, div.alliance table#foreign, div.alliance table#existing { margin-top: 10px; }
div.alliance table#member td.ra { text-align: right; white-space: nowrap; width: 5%; }
div.alliance table#member td.pla { text-align: left; }
div.alliance table#member td.hab { width: 25%; }
div.alliance table#member td.vil { width: 20%; }
div.alliance table#member td.on { width: 5%; }
div.alliance table#profile thead td { width: 50%; }
div.alliance table#profile td.details { border-bottom: none; height: 156px; padding: 0; vertical-align: top; width: 50%; }
div.alliance table#profile td.details table { background-color: #fff; border-collapse: collapse; margin-top: 0; }
div.alliance table#profile td.details table th { border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; width: 50%; }
div.alliance table#profile td.details table td { border-bottom: 1px solid #c0c0c0; text-align: left; }
div.alliance table#profile td.desc1 { padding: 0 7px; vertical-align: middle; width: 50%; }
div.alliance table#events td.event { text-align: left; }
div.alliance table#events td.dat { white-space: nowrap; width: 25%; }
div.alliance table#options td.val, div.alliance table#name td, div.alliance table#invitations td { text-align: left; }
div.alliance table#name input.tag { width: 50%; }
div.alliance table#edit thead td { width: 50%; }
div.alliance table#edit tbody th { width: 30%; }
div.alliance table#edit tbody td { line-height: 19px; text-align: left; }
div.alliance table#edit input.text, div.alliance table#diplomacy input.text { width: 94%; }
div.alliance table#edit td.desc1 { padding: 0; }
div.alliance table#edit td.desc1 textarea { overflow-x: hidden; overflow-y: scroll; padding: 0; text-align: center; height: 264px; width: 249px; font-size: 13px; }
div.alliance table#hint td, div.alliance table#tip td { font-size: 12px; }
div.alliance table#diplomacy input.radio { margin: 3px; }
div.alliance table#own td.wait { width: 25%; color: var(--hf-ink-soft, #5c4630); }
div.alliance table td.acc { text-align: center; width: 25%; }
div.alliance div#box { float: left; width: 60%; }
div.alliance div#rooms img.del { position: relative; top: 3px; }
div.alliance table.infos { float: right; width: 37%; }
div.alliance table.infos td { padding: 2px; }

/* ---- forum ---- */
div.forum h4 { margin: 0 0 15px 5px; font-size: 11px; font-weight: normal; }
div.forum p.error { font-weight: bold; }
div.forum table { width: 502px; }
div.forum table td, div.forum table th { padding: 2px 7px; }
div.forum table#public, div.forum table#confederation, div.forum table#alliance, div.forum table#closed { margin-top: 10px; }
div.forum table td.ico { padding: 5px; text-align: center; white-space: nowrap; width: 32px; }
div.forum table td.ico img { height: 25px; width: 26px; }
div.forum table td.ico a img { margin: 2px; height: 12px; width: 12px; }
div.forum table td.tit { padding: 5px; font-size: 11px; }
div.forum table td.last { padding: 2px 5px 2px 2px; text-align: right; white-space: nowrap; width: 120px; font-size: 10px; }
div.forum table td.none { text-align: center; }
div.forum table#new_forum tbody th { width: 30%; }
div.forum table#new_forum input.text { width: 97%; }
div.forum table#new_topic tbody th, div.forum table#edit_post tbody th { width: 87px; font-size: 11px; font-weight: bold; }
div.forum table#new_topic textarea, div.forum table#edit_post textarea { height: 250px; overflow: auto; width: 381px; }
div.forum table#new_topic td.sel { text-align: center; }
div.forum table#new_topic table#options td { padding-bottom: 0; }
div.forum table#new_topic table#options input.text { margin-bottom: 2px; }
div.forum table#new_topic select.dropdown { margin-right: 1px; }
div.forum textarea#text { margin-top: 10px; padding: 5px; width: 400px; }

/* ---- page frame of the administration page (layout/Shell.tsx) ---- */
.wrapper { position: relative; min-height: 100%; }
div#dynamic_header { height: 100px; min-width: 980px; width: 100%; overflow: hidden; }
div#header { height: 72px; min-width: 980px; width: 100%; }
div#mtop { position: relative; height: 72px; left: 50%; margin-left: -241px; top: -7px; width: 700px; z-index: 2; }
div#mid { margin: 0 auto 15px; min-width: 980px; width: 980px; }
div#side_navi { float: left; position: relative; width: 155px; min-height: 453px; margin-top: 30px; }
div#side_navi p { line-height: 20px; margin: 0 0 28px; }
div#side_navi p a { display: block; padding-left: 12px; }
div#side_navi table { background-color: #fff; width: auto; padding-left: 12px; }
div#side_navi table td { line-height: 18px; padding: 0; text-align: left; white-space: nowrap; }
div#side_navi table thead td { background-color: #fff; height: 22px; }
div#side_navi td.dot { padding: 0 6px; width: 10px; }
div#side_navi td.link { padding-right: 10px; }
div#side_info { float: left; position: relative; min-height: 453px; padding: 5px 0 0 16px; width: 257px; z-index: 3; }
div#side_info h5 { margin-left: 10px; }
div#side_info h6 { margin: 0; padding: 0; }
div#side_info table { background-color: #fff; width: auto; }
div#side_info table td { line-height: 18px; padding: 0; text-align: left; white-space: nowrap; vertical-align: top; }
div#side_info table thead td { background-color: #fff; height: 22px; }
div#side_info td.dot { padding: 0 6px; width: 8px; }
div#side_info td.link { padding-right: 0; white-space: normal; }
.footer-stopper { float: left; margin-bottom: 100px; }
div#footer { position: absolute; left: 0; right: 0; bottom: 0; clear: both; height: 90px; margin-top: 90px; min-width: 980px; background: #f1f1f1; font-size: 11px; line-height: 19px; }
div#footer div#mfoot { height: 28px; margin: 0 auto; padding: 15px 0 30px; width: 905px; text-align: right; }
div#footer div.footer-menu { color: #797979; text-align: right; }
div#footer div#mfoot a, div#footer div#mfoot a:visited, div#footer div#mfoot a:active { color: #797979; }
div#footer div#mfoot div.copyright { direction: ltr; text-align: right; font-size: 11px; }