/* The legacy H&A staff portal: light, rigid, 2016. It was already old when it froze. */
body {
  margin: 0; padding: 24px 0 40px; background: #d9d7d2;
  font: 13px/1.5 Tahoma, Verdana, 'Segoe UI', Arial, sans-serif; color: #222;
}
.shell { width: 720px; max-width: calc(100% - 24px); margin: 0 auto; background: #f4f3f0; border: 1px solid #a9a69e; box-shadow: 2px 2px 6px rgba(0, 0, 0, .18); }

.topbar { background: #1f3864; color: #fff; padding: 9px 14px; font-size: 14px; }
.topbar .brand { font-weight: bold; letter-spacing: .06em; }
.topbar .divider { color: #7f8bb0; margin: 0 8px; }
.topbar .division { color: #c8d2e8; }
.topbar .ver { float: right; color: #7f8bb0; font-size: 11px; margin-top: 2px; }

.strip { background: #e4e2dd; border-bottom: 1px solid #b5b2a9; padding: 5px 14px; font-size: 11px; color: #55524b; }
.strip .when { float: right; }

.notice { background: #fdf6d8; border-bottom: 1px solid #d8c98a; padding: 8px 14px; font-size: 12px; color: #4a4426; }

.layout { width: 100%; }
.layout td { vertical-align: top; }
.sidebar { width: 168px; background: #eceae5; border-right: 1px solid #b5b2a9; padding: 12px 10px; }
.content { padding: 18px 24px 26px; }

.box { border: 1px solid #b5b2a9; background: #f7f6f3; margin-bottom: 12px; }
.box-head { background: #dcdad3; border-bottom: 1px solid #b5b2a9; padding: 4px 8px; font-weight: bold; font-size: 11px; color: #3c3a33; letter-spacing: .04em; text-transform: uppercase; }
.box ul { list-style: none; margin: 0; padding: 4px 0; }
.box li { padding: 3px 10px; }
.box a { color: #1a4f8b; }
.box .dead { color: #8b887f; }
.box-body { padding: 6px 10px; font-size: 12px; }

.content h1 { font-size: 18px; font-weight: normal; color: #1f3864; border-bottom: 2px solid #1f3864; padding-bottom: 5px; margin: 0 0 12px; }
.lead { color: #44413a; margin: 0 0 18px; }

.form .lbl { font-size: 12px; color: #44413a; padding: 4px 8px 4px 0; white-space: nowrap; }
.form input {
  font: 13px Tahoma, Verdana, Arial, sans-serif; padding: 4px 6px; width: 220px;
  border: 1px solid #8b887f; background: #fff; color: #111;
}
.actions { padding-top: 12px; }
.actions button {
  font: 12px Tahoma, Verdana, Arial, sans-serif; padding: 4px 14px; margin-right: 6px; cursor: pointer;
  color: #222; background: #e6e4df; border: 1px solid #8b887f; border-radius: 2px;
  box-shadow: inset 0 1px 0 #fff;
}
.actions button:hover { background: #efeee9; }
.actions button:active { background: #d8d6d0; box-shadow: none; }

.error { margin-top: 12px; padding: 6px 10px; background: #fbe9e7; border: 1px solid #c98a7d; color: #7c2d1e; font-size: 12px; }

.fine { margin-top: 20px; font-size: 11px; color: #6b6860; }

.footer { clear: both; background: #e4e2dd; border-top: 1px solid #b5b2a9; padding: 7px 14px; font-size: 11px; color: #6b6860; }