:root {
  --sevenseas-navy: #12344d;
  --sevenseas-blue: #147db3;
  --sevenseas-cyan: #39b8d4;
  --sevenseas-sky: #eaf7fb;
  --sevenseas-line: #d9e5eb;
}

body {
  color: #183447;
}

#taskmenu {
  background: linear-gradient(180deg, #12344d 0%, #0b2739 100%);
  box-shadow: 3px 0 18px rgba(14, 48, 69, .14);
}

#taskmenu a:hover,
#taskmenu a.selected {
  background-color: rgba(57, 184, 212, .18);
  color: #fff;
}

#taskmenu a.selected:before,
#taskmenu .special-buttons a:hover:before {
  color: #49c4df;
}

.menu.toolbar a.button,
.menu.toolbar .dropbutton a.button {
  color: var(--sevenseas-navy);
}

.menu.toolbar a.button:hover,
.menu.toolbar a.button:focus {
  color: var(--sevenseas-blue);
}

.listing li.selected,
.listing tr.selected td,
.messagelist tr.selected td,
.listbox .listitem.selected {
  background-color: var(--sevenseas-sky) !important;
}

.listing li:hover,
.listing tr:hover td,
.messagelist tr:hover td {
  background-color: #f3fafc;
}

#layout-sidebar,
#layout-list,
#layout-content {
  border-color: var(--sevenseas-line);
}

.header a.button.icon.back-list-button,
.btn-primary {
  background-color: var(--sevenseas-blue);
  border-color: var(--sevenseas-blue);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #0f668f;
  border-color: #0f668f;
}

#login-form .box-inner {
  border-top: 4px solid var(--sevenseas-cyan);
  box-shadow: 0 18px 50px rgba(16, 52, 77, .16);
}

#login-form::after {
  content: "Seven Seas Group 企业邮箱";
  display: block;
  margin-top: 1rem;
  color: #587383;
  text-align: center;
  font-size: .92rem;
}

@media screen and (max-width: 768px) {
  #taskmenu {
    box-shadow: 0 -3px 18px rgba(14, 48, 69, .14);
  }
}