body.meta {
  --module-hue: 280;
  background-image: url(/themes/tint/280/pumpkins-red.jpg);
}
body.meta.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/280/pumpkins-red.jpg);
  background-size: cover;
}
body.meta.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/280/pumpkins-red.jpg);
}
@keyframes menu-hover-meta {
  10% {
    color: #000;
    background: hsl(280, 50%, 50%);
  }
  100% {
    background: hsla(280, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-meta-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/meta"] i {
  color: hsl(280, 50%, 50%);
}
.navbar a[href="/admin/meta"].active {
  color: #000;
  background: hsla(280, 50%, 50%, 0.3);
}
.navbar a[href="/admin/meta"]:focus,
.navbar a[href="/admin/meta"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(280, 50%, 50%), hsl(280, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/meta"]:hover {
  animation-name: menu-hover-meta;
}
.navbar a[href="/admin/meta"]:hover i {
  animation-name: menu-hover-meta-i;
}
body.problems {
  --module-hue: 1;
  background-image: url(/themes/tint/1/pumpkins-red.jpg);
}
body.problems.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/1/pumpkins-red.jpg);
  background-size: cover;
}
body.problems.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/1/pumpkins-red.jpg);
}
@keyframes menu-hover-problems {
  10% {
    color: #000;
    background: hsl(1, 50%, 50%);
  }
  100% {
    background: hsla(1, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-problems-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/problems"] i {
  color: hsl(1, 50%, 50%);
}
.navbar a[href="/admin/problems"].active {
  color: #000;
  background: hsla(1, 50%, 50%, 0.3);
}
.navbar a[href="/admin/problems"]:focus,
.navbar a[href="/admin/problems"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(1, 50%, 50%), hsl(1, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/problems"]:hover {
  animation-name: menu-hover-problems;
}
.navbar a[href="/admin/problems"]:hover i {
  animation-name: menu-hover-problems-i;
}
body.duties {
  --module-hue: 280;
  background-image: url(/themes/tint/280/pumpkins-red.jpg);
}
body.duties.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/280/pumpkins-red.jpg);
  background-size: cover;
}
body.duties.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/280/pumpkins-red.jpg);
}
@keyframes menu-hover-duties {
  10% {
    color: #000;
    background: hsl(280, 50%, 50%);
  }
  100% {
    background: hsla(280, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-duties-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/duties"] i {
  color: hsl(280, 50%, 50%);
}
.navbar a[href="/admin/duties"].active {
  color: #000;
  background: hsla(280, 50%, 50%, 0.3);
}
.navbar a[href="/admin/duties"]:focus,
.navbar a[href="/admin/duties"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(280, 50%, 50%), hsl(280, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/duties"]:hover {
  animation-name: menu-hover-duties;
}
.navbar a[href="/admin/duties"]:hover i {
  animation-name: menu-hover-duties-i;
}
body.dashboard {
  --module-hue: 280;
  background-image: url(/themes/tint/280/pumpkins-red.jpg);
}
body.dashboard.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/280/pumpkins-red.jpg);
  background-size: cover;
}
body.dashboard.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/280/pumpkins-red.jpg);
}
@keyframes menu-hover-dashboard {
  10% {
    color: #000;
    background: hsl(280, 50%, 50%);
  }
  100% {
    background: hsla(280, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-dashboard-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/dashboard"] i {
  color: hsl(280, 50%, 50%);
}
.navbar a[href="/admin/dashboard"].active {
  color: #000;
  background: hsla(280, 50%, 50%, 0.3);
}
.navbar a[href="/admin/dashboard"]:focus,
.navbar a[href="/admin/dashboard"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(280, 50%, 50%), hsl(280, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/dashboard"]:hover {
  animation-name: menu-hover-dashboard;
}
.navbar a[href="/admin/dashboard"]:hover i {
  animation-name: menu-hover-dashboard-i;
}
body.calls {
  --module-hue: 325;
  background-image: url(/themes/tint/325/pumpkins-red.jpg);
}
body.calls.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/325/pumpkins-red.jpg);
  background-size: cover;
}
body.calls.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/325/pumpkins-red.jpg);
}
@keyframes menu-hover-calls {
  10% {
    color: #000;
    background: hsl(325, 50%, 50%);
  }
  100% {
    background: hsla(325, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-calls-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/calls"] i {
  color: hsl(325, 50%, 50%);
}
.navbar a[href="/admin/calls"].active {
  color: #000;
  background: hsla(325, 50%, 50%, 0.3);
}
.navbar a[href="/admin/calls"]:focus,
.navbar a[href="/admin/calls"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(325, 50%, 50%), hsl(325, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/calls"]:hover {
  animation-name: menu-hover-calls;
}
.navbar a[href="/admin/calls"]:hover i {
  animation-name: menu-hover-calls-i;
}
body.chats {
  --module-hue: 60;
  background-image: url(/themes/tint/60/pumpkins-red.jpg);
}
body.chats.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/60/pumpkins-red.jpg);
  background-size: cover;
}
body.chats.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/60/pumpkins-red.jpg);
}
@keyframes menu-hover-chats {
  10% {
    color: #000;
    background: hsl(60, 50%, 50%);
  }
  100% {
    background: hsla(60, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-chats-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/chats"] i {
  color: hsl(60, 50%, 50%);
}
.navbar a[href="/admin/chats"].active {
  color: #000;
  background: hsla(60, 50%, 50%, 0.3);
}
.navbar a[href="/admin/chats"]:focus,
.navbar a[href="/admin/chats"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(60, 50%, 50%), hsl(60, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/chats"]:hover {
  animation-name: menu-hover-chats;
}
.navbar a[href="/admin/chats"]:hover i {
  animation-name: menu-hover-chats-i;
}
body.mails {
  --module-hue: 300;
  background-image: url(/themes/tint/300/pumpkins-red.jpg);
}
body.mails.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/300/pumpkins-red.jpg);
  background-size: cover;
}
body.mails.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/300/pumpkins-red.jpg);
}
@keyframes menu-hover-mails {
  10% {
    color: #000;
    background: hsl(300, 50%, 50%);
  }
  100% {
    background: hsla(300, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-mails-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/mails"] i {
  color: hsl(300, 50%, 50%);
}
.navbar a[href="/admin/mails"].active {
  color: #000;
  background: hsla(300, 50%, 50%, 0.3);
}
.navbar a[href="/admin/mails"]:focus,
.navbar a[href="/admin/mails"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(300, 50%, 50%), hsl(300, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/mails"]:hover {
  animation-name: menu-hover-mails;
}
.navbar a[href="/admin/mails"]:hover i {
  animation-name: menu-hover-mails-i;
}
body.mail-templates {
  --module-hue: 300;
  background-image: url(/themes/tint/300/pumpkins-red.jpg);
}
body.mail-templates.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/300/pumpkins-red.jpg);
  background-size: cover;
}
body.mail-templates.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/300/pumpkins-red.jpg);
}
@keyframes menu-hover-mail-templates {
  10% {
    color: #000;
    background: hsl(300, 50%, 50%);
  }
  100% {
    background: hsla(300, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-mail-templates-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/mail-templates"] i {
  color: hsl(300, 50%, 50%);
}
.navbar a[href="/admin/mail-templates"].active {
  color: #000;
  background: hsla(300, 50%, 50%, 0.3);
}
.navbar a[href="/admin/mail-templates"]:focus,
.navbar a[href="/admin/mail-templates"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(300, 50%, 50%), hsl(300, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/mail-templates"]:hover {
  animation-name: menu-hover-mail-templates;
}
.navbar a[href="/admin/mail-templates"]:hover i {
  animation-name: menu-hover-mail-templates-i;
}
body.drive {
  --module-hue: 240;
  background-image: url(/themes/tint/240/pumpkins-red.jpg);
}
body.drive.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/240/pumpkins-red.jpg);
  background-size: cover;
}
body.drive.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/240/pumpkins-red.jpg);
}
@keyframes menu-hover-drive {
  10% {
    color: #000;
    background: hsl(240, 50%, 50%);
  }
  100% {
    background: hsla(240, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-drive-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/drive"] i {
  color: hsl(240, 50%, 50%);
}
.navbar a[href="/admin/drive"].active {
  color: #000;
  background: hsla(240, 50%, 50%, 0.3);
}
.navbar a[href="/admin/drive"]:focus,
.navbar a[href="/admin/drive"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(240, 50%, 50%), hsl(240, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/drive"]:hover {
  animation-name: menu-hover-drive;
}
.navbar a[href="/admin/drive"]:hover i {
  animation-name: menu-hover-drive-i;
}
body.tags {
  --module-hue: 140;
  background-image: url(/themes/tint/140/pumpkins-red.jpg);
}
body.tags.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/140/pumpkins-red.jpg);
  background-size: cover;
}
body.tags.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/140/pumpkins-red.jpg);
}
@keyframes menu-hover-tags {
  10% {
    color: #000;
    background: hsl(140, 50%, 50%);
  }
  100% {
    background: hsla(140, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-tags-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/tags"] i {
  color: hsl(140, 50%, 50%);
}
.navbar a[href="/admin/tags"].active {
  color: #000;
  background: hsla(140, 50%, 50%, 0.3);
}
.navbar a[href="/admin/tags"]:focus,
.navbar a[href="/admin/tags"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(140, 50%, 50%), hsl(140, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/tags"]:hover {
  animation-name: menu-hover-tags;
}
.navbar a[href="/admin/tags"]:hover i {
  animation-name: menu-hover-tags-i;
}
body.reminders {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.reminders.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.reminders.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-reminders {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-reminders-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/reminders"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/reminders"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/reminders"]:focus,
.navbar a[href="/admin/reminders"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/reminders"]:hover {
  animation-name: menu-hover-reminders;
}
.navbar a[href="/admin/reminders"]:hover i {
  animation-name: menu-hover-reminders-i;
}
body.reminderLog {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.reminderLog.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.reminderLog.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-reminderLog {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-reminderLog-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/reminderLog"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/reminderLog"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/reminderLog"]:focus,
.navbar a[href="/admin/reminderLog"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/reminderLog"]:hover {
  animation-name: menu-hover-reminderLog;
}
.navbar a[href="/admin/reminderLog"]:hover i {
  animation-name: menu-hover-reminderLog-i;
}
body.contacts {
  --module-hue: 1;
  background-image: url(/themes/tint/1/pumpkins-red.jpg);
}
body.contacts.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/1/pumpkins-red.jpg);
  background-size: cover;
}
body.contacts.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/1/pumpkins-red.jpg);
}
@keyframes menu-hover-contacts {
  10% {
    color: #000;
    background: hsl(1, 50%, 50%);
  }
  100% {
    background: hsla(1, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-contacts-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/contacts"] i {
  color: hsl(1, 50%, 50%);
}
.navbar a[href="/admin/contacts"].active {
  color: #000;
  background: hsla(1, 50%, 50%, 0.3);
}
.navbar a[href="/admin/contacts"]:focus,
.navbar a[href="/admin/contacts"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(1, 50%, 50%), hsl(1, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/contacts"]:hover {
  animation-name: menu-hover-contacts;
}
.navbar a[href="/admin/contacts"]:hover i {
  animation-name: menu-hover-contacts-i;
}
body.customers {
  --module-hue: 1;
  background-image: url(/themes/tint/1/pumpkins-red.jpg);
}
body.customers.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/1/pumpkins-red.jpg);
  background-size: cover;
}
body.customers.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/1/pumpkins-red.jpg);
}
@keyframes menu-hover-customers {
  10% {
    color: #000;
    background: hsl(1, 50%, 50%);
  }
  100% {
    background: hsla(1, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-customers-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/customers"] i {
  color: hsl(1, 50%, 50%);
}
.navbar a[href="/admin/customers"].active {
  color: #000;
  background: hsla(1, 50%, 50%, 0.3);
}
.navbar a[href="/admin/customers"]:focus,
.navbar a[href="/admin/customers"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(1, 50%, 50%), hsl(1, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/customers"]:hover {
  animation-name: menu-hover-customers;
}
.navbar a[href="/admin/customers"]:hover i {
  animation-name: menu-hover-customers-i;
}
body.project-groups {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.project-groups.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.project-groups.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-project-groups {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-project-groups-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/project-groups"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/project-groups"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/project-groups"]:focus,
.navbar a[href="/admin/project-groups"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/project-groups"]:hover {
  animation-name: menu-hover-project-groups;
}
.navbar a[href="/admin/project-groups"]:hover i {
  animation-name: menu-hover-project-groups-i;
}
body.projects {
  --module-hue: 60;
  background-image: url(/themes/tint/60/pumpkins-red.jpg);
}
body.projects.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/60/pumpkins-red.jpg);
  background-size: cover;
}
body.projects.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/60/pumpkins-red.jpg);
}
@keyframes menu-hover-projects {
  10% {
    color: #000;
    background: hsl(60, 50%, 50%);
  }
  100% {
    background: hsla(60, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-projects-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/projects"] i {
  color: hsl(60, 50%, 50%);
}
.navbar a[href="/admin/projects"].active {
  color: #000;
  background: hsla(60, 50%, 50%, 0.3);
}
.navbar a[href="/admin/projects"]:focus,
.navbar a[href="/admin/projects"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(60, 50%, 50%), hsl(60, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/projects"]:hover {
  animation-name: menu-hover-projects;
}
.navbar a[href="/admin/projects"]:hover i {
  animation-name: menu-hover-projects-i;
}
body.work-orders {
  --module-hue: 80;
  background-image: url(/themes/tint/80/pumpkins-red.jpg);
}
body.work-orders.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/80/pumpkins-red.jpg);
  background-size: cover;
}
body.work-orders.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/80/pumpkins-red.jpg);
}
@keyframes menu-hover-work-orders {
  10% {
    color: #000;
    background: hsl(80, 50%, 50%);
  }
  100% {
    background: hsla(80, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-work-orders-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/work-orders"] i {
  color: hsl(80, 50%, 50%);
}
.navbar a[href="/admin/work-orders"].active {
  color: #000;
  background: hsla(80, 50%, 50%, 0.3);
}
.navbar a[href="/admin/work-orders"]:focus,
.navbar a[href="/admin/work-orders"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(80, 50%, 50%), hsl(80, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/work-orders"]:hover {
  animation-name: menu-hover-work-orders;
}
.navbar a[href="/admin/work-orders"]:hover i {
  animation-name: menu-hover-work-orders-i;
}
body.transactions {
  --module-hue: 120;
  background-image: url(/themes/tint/120/pumpkins-red.jpg);
}
body.transactions.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/120/pumpkins-red.jpg);
  background-size: cover;
}
body.transactions.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/120/pumpkins-red.jpg);
}
@keyframes menu-hover-transactions {
  10% {
    color: #000;
    background: hsl(120, 50%, 50%);
  }
  100% {
    background: hsla(120, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-transactions-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/transactions"] i {
  color: hsl(120, 50%, 50%);
}
.navbar a[href="/admin/transactions"].active {
  color: #000;
  background: hsla(120, 50%, 50%, 0.3);
}
.navbar a[href="/admin/transactions"]:focus,
.navbar a[href="/admin/transactions"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(120, 50%, 50%), hsl(120, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/transactions"]:hover {
  animation-name: menu-hover-transactions;
}
.navbar a[href="/admin/transactions"]:hover i {
  animation-name: menu-hover-transactions-i;
}
body.biddings {
  --module-hue: 140;
  background-image: url(/themes/tint/140/pumpkins-red.jpg);
}
body.biddings.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/140/pumpkins-red.jpg);
  background-size: cover;
}
body.biddings.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/140/pumpkins-red.jpg);
}
@keyframes menu-hover-biddings {
  10% {
    color: #000;
    background: hsl(140, 50%, 50%);
  }
  100% {
    background: hsla(140, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-biddings-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/biddings"] i {
  color: hsl(140, 50%, 50%);
}
.navbar a[href="/admin/biddings"].active {
  color: #000;
  background: hsla(140, 50%, 50%, 0.3);
}
.navbar a[href="/admin/biddings"]:focus,
.navbar a[href="/admin/biddings"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(140, 50%, 50%), hsl(140, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/biddings"]:hover {
  animation-name: menu-hover-biddings;
}
.navbar a[href="/admin/biddings"]:hover i {
  animation-name: menu-hover-biddings-i;
}
body.product-groups {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.product-groups.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.product-groups.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-product-groups {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-product-groups-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/product-groups"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/product-groups"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/product-groups"]:focus,
.navbar a[href="/admin/product-groups"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/product-groups"]:hover {
  animation-name: menu-hover-product-groups;
}
.navbar a[href="/admin/product-groups"]:hover i {
  animation-name: menu-hover-product-groups-i;
}
body.products {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.products.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.products.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-products {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-products-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/products"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/products"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/products"]:focus,
.navbar a[href="/admin/products"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/products"]:hover {
  animation-name: menu-hover-products;
}
.navbar a[href="/admin/products"]:hover i {
  animation-name: menu-hover-products-i;
}
body.product-tags {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.product-tags.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.product-tags.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-product-tags {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-product-tags-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/product-tags"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/product-tags"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/product-tags"]:focus,
.navbar a[href="/admin/product-tags"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/product-tags"]:hover {
  animation-name: menu-hover-product-tags;
}
.navbar a[href="/admin/product-tags"]:hover i {
  animation-name: menu-hover-product-tags-i;
}
body.product-stock {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.product-stock.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.product-stock.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-product-stock {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-product-stock-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/product-stock"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/product-stock"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/product-stock"]:focus,
.navbar a[href="/admin/product-stock"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/product-stock"]:hover {
  animation-name: menu-hover-product-stock;
}
.navbar a[href="/admin/product-stock"]:hover i {
  animation-name: menu-hover-product-stock-i;
}
body.restock {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.restock.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.restock.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-restock {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-restock-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/restock"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/restock"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/restock"]:focus,
.navbar a[href="/admin/restock"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/restock"]:hover {
  animation-name: menu-hover-restock;
}
.navbar a[href="/admin/restock"]:hover i {
  animation-name: menu-hover-restock-i;
}
body.subscriptions {
  --module-hue: 40;
  background-image: url(/themes/tint/40/pumpkins-red.jpg);
}
body.subscriptions.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/40/pumpkins-red.jpg);
  background-size: cover;
}
body.subscriptions.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/40/pumpkins-red.jpg);
}
@keyframes menu-hover-subscriptions {
  10% {
    color: #000;
    background: hsl(40, 50%, 50%);
  }
  100% {
    background: hsla(40, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-subscriptions-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/subscriptions"] i {
  color: hsl(40, 50%, 50%);
}
.navbar a[href="/admin/subscriptions"].active {
  color: #000;
  background: hsla(40, 50%, 50%, 0.3);
}
.navbar a[href="/admin/subscriptions"]:focus,
.navbar a[href="/admin/subscriptions"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(40, 50%, 50%), hsl(40, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/subscriptions"]:hover {
  animation-name: menu-hover-subscriptions;
}
.navbar a[href="/admin/subscriptions"]:hover i {
  animation-name: menu-hover-subscriptions-i;
}
body.income {
  --module-hue: 120;
  background-image: url(/themes/tint/120/pumpkins-red.jpg);
}
body.income.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/120/pumpkins-red.jpg);
  background-size: cover;
}
body.income.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/120/pumpkins-red.jpg);
}
@keyframes menu-hover-income {
  10% {
    color: #000;
    background: hsl(120, 50%, 50%);
  }
  100% {
    background: hsla(120, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-income-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/income"] i {
  color: hsl(120, 50%, 50%);
}
.navbar a[href="/admin/income"].active {
  color: #000;
  background: hsla(120, 50%, 50%, 0.3);
}
.navbar a[href="/admin/income"]:focus,
.navbar a[href="/admin/income"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(120, 50%, 50%), hsl(120, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/income"]:hover {
  animation-name: menu-hover-income;
}
.navbar a[href="/admin/income"]:hover i {
  animation-name: menu-hover-income-i;
}
body.dunnings {
  --module-hue: 1;
  background-image: url(/themes/tint/1/pumpkins-red.jpg);
}
body.dunnings.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/1/pumpkins-red.jpg);
  background-size: cover;
}
body.dunnings.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/1/pumpkins-red.jpg);
}
@keyframes menu-hover-dunnings {
  10% {
    color: #000;
    background: hsl(1, 50%, 50%);
  }
  100% {
    background: hsla(1, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-dunnings-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/dunnings"] i {
  color: hsl(1, 50%, 50%);
}
.navbar a[href="/admin/dunnings"].active {
  color: #000;
  background: hsla(1, 50%, 50%, 0.3);
}
.navbar a[href="/admin/dunnings"]:focus,
.navbar a[href="/admin/dunnings"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(1, 50%, 50%), hsl(1, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/dunnings"]:hover {
  animation-name: menu-hover-dunnings;
}
.navbar a[href="/admin/dunnings"]:hover i {
  animation-name: menu-hover-dunnings-i;
}
body.balance {
  --module-hue: 120;
  background-image: url(/themes/tint/120/pumpkins-red.jpg);
}
body.balance.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/120/pumpkins-red.jpg);
  background-size: cover;
}
body.balance.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/120/pumpkins-red.jpg);
}
@keyframes menu-hover-balance {
  10% {
    color: #000;
    background: hsl(120, 50%, 50%);
  }
  100% {
    background: hsla(120, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-balance-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/balance"] i {
  color: hsl(120, 50%, 50%);
}
.navbar a[href="/admin/balance"].active {
  color: #000;
  background: hsla(120, 50%, 50%, 0.3);
}
.navbar a[href="/admin/balance"]:focus,
.navbar a[href="/admin/balance"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(120, 50%, 50%), hsl(120, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/balance"]:hover {
  animation-name: menu-hover-balance;
}
.navbar a[href="/admin/balance"]:hover i {
  animation-name: menu-hover-balance-i;
}
body.finance {
  --module-hue: 120;
  background-image: url(/themes/tint/120/pumpkins-red.jpg);
}
body.finance.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/120/pumpkins-red.jpg);
  background-size: cover;
}
body.finance.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/120/pumpkins-red.jpg);
}
@keyframes menu-hover-finance {
  10% {
    color: #000;
    background: hsl(120, 50%, 50%);
  }
  100% {
    background: hsla(120, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-finance-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/finance"] i {
  color: hsl(120, 50%, 50%);
}
.navbar a[href="/admin/finance"].active {
  color: #000;
  background: hsla(120, 50%, 50%, 0.3);
}
.navbar a[href="/admin/finance"]:focus,
.navbar a[href="/admin/finance"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(120, 50%, 50%), hsl(120, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/finance"]:hover {
  animation-name: menu-hover-finance;
}
.navbar a[href="/admin/finance"]:hover i {
  animation-name: menu-hover-finance-i;
}
body.cost-centers {
  --module-hue: 120;
  background-image: url(/themes/tint/120/pumpkins-red.jpg);
}
body.cost-centers.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/120/pumpkins-red.jpg);
  background-size: cover;
}
body.cost-centers.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/120/pumpkins-red.jpg);
}
@keyframes menu-hover-cost-centers {
  10% {
    color: #000;
    background: hsl(120, 50%, 50%);
  }
  100% {
    background: hsla(120, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-cost-centers-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/cost-centers"] i {
  color: hsl(120, 50%, 50%);
}
.navbar a[href="/admin/cost-centers"].active {
  color: #000;
  background: hsla(120, 50%, 50%, 0.3);
}
.navbar a[href="/admin/cost-centers"]:focus,
.navbar a[href="/admin/cost-centers"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(120, 50%, 50%), hsl(120, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/cost-centers"]:hover {
  animation-name: menu-hover-cost-centers;
}
.navbar a[href="/admin/cost-centers"]:hover i {
  animation-name: menu-hover-cost-centers-i;
}
body.insight {
  --module-hue: 140;
  background-image: url(/themes/tint/140/pumpkins-red.jpg);
}
body.insight.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/140/pumpkins-red.jpg);
  background-size: cover;
}
body.insight.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/140/pumpkins-red.jpg);
}
@keyframes menu-hover-insight {
  10% {
    color: #000;
    background: hsl(140, 50%, 50%);
  }
  100% {
    background: hsla(140, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-insight-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/insight"] i {
  color: hsl(140, 50%, 50%);
}
.navbar a[href="/admin/insight"].active {
  color: #000;
  background: hsla(140, 50%, 50%, 0.3);
}
.navbar a[href="/admin/insight"]:focus,
.navbar a[href="/admin/insight"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(140, 50%, 50%), hsl(140, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/insight"]:hover {
  animation-name: menu-hover-insight;
}
.navbar a[href="/admin/insight"]:hover i {
  animation-name: menu-hover-insight-i;
}
body.payments {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.payments.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.payments.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-payments {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-payments-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/payments"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/payments"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/payments"]:focus,
.navbar a[href="/admin/payments"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/payments"]:hover {
  animation-name: menu-hover-payments;
}
.navbar a[href="/admin/payments"]:hover i {
  animation-name: menu-hover-payments-i;
}
body.expenses {
  --module-hue: 280;
  background-image: url(/themes/tint/280/pumpkins-red.jpg);
}
body.expenses.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/280/pumpkins-red.jpg);
  background-size: cover;
}
body.expenses.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/280/pumpkins-red.jpg);
}
@keyframes menu-hover-expenses {
  10% {
    color: #000;
    background: hsl(280, 50%, 50%);
  }
  100% {
    background: hsla(280, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-expenses-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/expenses"] i {
  color: hsl(280, 50%, 50%);
}
.navbar a[href="/admin/expenses"].active {
  color: #000;
  background: hsla(280, 50%, 50%, 0.3);
}
.navbar a[href="/admin/expenses"]:focus,
.navbar a[href="/admin/expenses"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(280, 50%, 50%), hsl(280, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/expenses"]:hover {
  animation-name: menu-hover-expenses;
}
.navbar a[href="/admin/expenses"]:hover i {
  animation-name: menu-hover-expenses-i;
}
body.suppliers {
  --module-hue: 270;
  background-image: url(/themes/tint/270/pumpkins-red.jpg);
}
body.suppliers.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/270/pumpkins-red.jpg);
  background-size: cover;
}
body.suppliers.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/270/pumpkins-red.jpg);
}
@keyframes menu-hover-suppliers {
  10% {
    color: #000;
    background: hsl(270, 50%, 50%);
  }
  100% {
    background: hsla(270, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-suppliers-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/suppliers"] i {
  color: hsl(270, 50%, 50%);
}
.navbar a[href="/admin/suppliers"].active {
  color: #000;
  background: hsla(270, 50%, 50%, 0.3);
}
.navbar a[href="/admin/suppliers"]:focus,
.navbar a[href="/admin/suppliers"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(270, 50%, 50%), hsl(270, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/suppliers"]:hover {
  animation-name: menu-hover-suppliers;
}
.navbar a[href="/admin/suppliers"]:hover i {
  animation-name: menu-hover-suppliers-i;
}
body.supplier-invoices {
  --module-hue: 275;
  background-image: url(/themes/tint/275/pumpkins-red.jpg);
}
body.supplier-invoices.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/275/pumpkins-red.jpg);
  background-size: cover;
}
body.supplier-invoices.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/275/pumpkins-red.jpg);
}
@keyframes menu-hover-supplier-invoices {
  10% {
    color: #000;
    background: hsl(275, 50%, 50%);
  }
  100% {
    background: hsla(275, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-supplier-invoices-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/supplier-invoices"] i {
  color: hsl(275, 50%, 50%);
}
.navbar a[href="/admin/supplier-invoices"].active {
  color: #000;
  background: hsla(275, 50%, 50%, 0.3);
}
.navbar a[href="/admin/supplier-invoices"]:focus,
.navbar a[href="/admin/supplier-invoices"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(275, 50%, 50%), hsl(275, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/supplier-invoices"]:hover {
  animation-name: menu-hover-supplier-invoices;
}
.navbar a[href="/admin/supplier-invoices"]:hover i {
  animation-name: menu-hover-supplier-invoices-i;
}
body.subcontractors {
  --module-hue: 240;
  background-image: url(/themes/tint/240/pumpkins-red.jpg);
}
body.subcontractors.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/240/pumpkins-red.jpg);
  background-size: cover;
}
body.subcontractors.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/240/pumpkins-red.jpg);
}
@keyframes menu-hover-subcontractors {
  10% {
    color: #000;
    background: hsl(240, 50%, 50%);
  }
  100% {
    background: hsla(240, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-subcontractors-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/subcontractors"] i {
  color: hsl(240, 50%, 50%);
}
.navbar a[href="/admin/subcontractors"].active {
  color: #000;
  background: hsla(240, 50%, 50%, 0.3);
}
.navbar a[href="/admin/subcontractors"]:focus,
.navbar a[href="/admin/subcontractors"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(240, 50%, 50%), hsl(240, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/subcontractors"]:hover {
  animation-name: menu-hover-subcontractors;
}
.navbar a[href="/admin/subcontractors"]:hover i {
  animation-name: menu-hover-subcontractors-i;
}
body.subcontractor-invoices {
  --module-hue: 250;
  background-image: url(/themes/tint/250/pumpkins-red.jpg);
}
body.subcontractor-invoices.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/250/pumpkins-red.jpg);
  background-size: cover;
}
body.subcontractor-invoices.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/250/pumpkins-red.jpg);
}
@keyframes menu-hover-subcontractor-invoices {
  10% {
    color: #000;
    background: hsl(250, 50%, 50%);
  }
  100% {
    background: hsla(250, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-subcontractor-invoices-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/subcontractor-invoices"] i {
  color: hsl(250, 50%, 50%);
}
.navbar a[href="/admin/subcontractor-invoices"].active {
  color: #000;
  background: hsla(250, 50%, 50%, 0.3);
}
.navbar a[href="/admin/subcontractor-invoices"]:focus,
.navbar a[href="/admin/subcontractor-invoices"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(250, 50%, 50%), hsl(250, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/subcontractor-invoices"]:hover {
  animation-name: menu-hover-subcontractor-invoices;
}
.navbar a[href="/admin/subcontractor-invoices"]:hover i {
  animation-name: menu-hover-subcontractor-invoices-i;
}
body.specification-positions {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.specification-positions.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.specification-positions.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-specification-positions {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-specification-positions-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/specification-positions"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/specification-positions"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/specification-positions"]:focus,
.navbar a[href="/admin/specification-positions"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/specification-positions"]:hover {
  animation-name: menu-hover-specification-positions;
}
.navbar a[href="/admin/specification-positions"]:hover i {
  animation-name: menu-hover-specification-positions-i;
}
body.specification-categories {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.specification-categories.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.specification-categories.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-specification-categories {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-specification-categories-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/specification-categories"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/specification-categories"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/specification-categories"]:focus,
.navbar a[href="/admin/specification-categories"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/specification-categories"]:hover {
  animation-name: menu-hover-specification-categories;
}
.navbar a[href="/admin/specification-categories"]:hover i {
  animation-name: menu-hover-specification-categories-i;
}
body.documents {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.documents.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.documents.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-documents {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-documents-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/documents"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/documents"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/documents"]:focus,
.navbar a[href="/admin/documents"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/documents"]:hover {
  animation-name: menu-hover-documents;
}
.navbar a[href="/admin/documents"]:hover i {
  animation-name: menu-hover-documents-i;
}
body.document-templates {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.document-templates.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.document-templates.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-document-templates {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-document-templates-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/document-templates"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/document-templates"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/document-templates"]:focus,
.navbar a[href="/admin/document-templates"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/document-templates"]:hover {
  animation-name: menu-hover-document-templates;
}
.navbar a[href="/admin/document-templates"]:hover i {
  animation-name: menu-hover-document-templates-i;
}
body.accounting {
  --module-hue: 160;
  background-image: url(/themes/tint/160/pumpkins-red.jpg);
}
body.accounting.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/160/pumpkins-red.jpg);
  background-size: cover;
}
body.accounting.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/160/pumpkins-red.jpg);
}
@keyframes menu-hover-accounting {
  10% {
    color: #000;
    background: hsl(160, 50%, 50%);
  }
  100% {
    background: hsla(160, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-accounting-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/accounting"] i {
  color: hsl(160, 50%, 50%);
}
.navbar a[href="/admin/accounting"].active {
  color: #000;
  background: hsla(160, 50%, 50%, 0.3);
}
.navbar a[href="/admin/accounting"]:focus,
.navbar a[href="/admin/accounting"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(160, 50%, 50%), hsl(160, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/accounting"]:hover {
  animation-name: menu-hover-accounting;
}
.navbar a[href="/admin/accounting"]:hover i {
  animation-name: menu-hover-accounting-i;
}
body.hour-banks {
  --module-hue: 180;
  background-image: url(/themes/tint/180/pumpkins-red.jpg);
}
body.hour-banks.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/180/pumpkins-red.jpg);
  background-size: cover;
}
body.hour-banks.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/180/pumpkins-red.jpg);
}
@keyframes menu-hover-hour-banks {
  10% {
    color: #000;
    background: hsl(180, 50%, 50%);
  }
  100% {
    background: hsla(180, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-hour-banks-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/hour-banks"] i {
  color: hsl(180, 50%, 50%);
}
.navbar a[href="/admin/hour-banks"].active {
  color: #000;
  background: hsla(180, 50%, 50%, 0.3);
}
.navbar a[href="/admin/hour-banks"]:focus,
.navbar a[href="/admin/hour-banks"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(180, 50%, 50%), hsl(180, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/hour-banks"]:hover {
  animation-name: menu-hover-hour-banks;
}
.navbar a[href="/admin/hour-banks"]:hover i {
  animation-name: menu-hover-hour-banks-i;
}
body.schedule {
  --module-hue: 180;
  background-image: url(/themes/tint/180/pumpkins-red.jpg);
}
body.schedule.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/180/pumpkins-red.jpg);
  background-size: cover;
}
body.schedule.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/180/pumpkins-red.jpg);
}
@keyframes menu-hover-schedule {
  10% {
    color: #000;
    background: hsl(180, 50%, 50%);
  }
  100% {
    background: hsla(180, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-schedule-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/schedule"] i {
  color: hsl(180, 50%, 50%);
}
.navbar a[href="/admin/schedule"].active {
  color: #000;
  background: hsla(180, 50%, 50%, 0.3);
}
.navbar a[href="/admin/schedule"]:focus,
.navbar a[href="/admin/schedule"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(180, 50%, 50%), hsl(180, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/schedule"]:hover {
  animation-name: menu-hover-schedule;
}
.navbar a[href="/admin/schedule"]:hover i {
  animation-name: menu-hover-schedule-i;
}
body.timesheet {
  --module-hue: 200;
  background-image: url(/themes/tint/200/pumpkins-red.jpg);
}
body.timesheet.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/200/pumpkins-red.jpg);
  background-size: cover;
}
body.timesheet.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/200/pumpkins-red.jpg);
}
@keyframes menu-hover-timesheet {
  10% {
    color: #000;
    background: hsl(200, 50%, 50%);
  }
  100% {
    background: hsla(200, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-timesheet-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/timesheet"] i {
  color: hsl(200, 50%, 50%);
}
.navbar a[href="/admin/timesheet"].active {
  color: #000;
  background: hsla(200, 50%, 50%, 0.3);
}
.navbar a[href="/admin/timesheet"]:focus,
.navbar a[href="/admin/timesheet"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(200, 50%, 50%), hsl(200, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/timesheet"]:hover {
  animation-name: menu-hover-timesheet;
}
.navbar a[href="/admin/timesheet"]:hover i {
  animation-name: menu-hover-timesheet-i;
}
body.teams {
  --module-hue: 220;
  background-image: url(/themes/tint/220/pumpkins-red.jpg);
}
body.teams.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/220/pumpkins-red.jpg);
  background-size: cover;
}
body.teams.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/220/pumpkins-red.jpg);
}
@keyframes menu-hover-teams {
  10% {
    color: #000;
    background: hsl(220, 50%, 50%);
  }
  100% {
    background: hsla(220, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-teams-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/teams"] i {
  color: hsl(220, 50%, 50%);
}
.navbar a[href="/admin/teams"].active {
  color: #000;
  background: hsla(220, 50%, 50%, 0.3);
}
.navbar a[href="/admin/teams"]:focus,
.navbar a[href="/admin/teams"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(220, 50%, 50%), hsl(220, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/teams"]:hover {
  animation-name: menu-hover-teams;
}
.navbar a[href="/admin/teams"]:hover i {
  animation-name: menu-hover-teams-i;
}
body.transaction-units {
  --module-hue: 240;
  background-image: url(/themes/tint/240/pumpkins-red.jpg);
}
body.transaction-units.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/240/pumpkins-red.jpg);
  background-size: cover;
}
body.transaction-units.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/240/pumpkins-red.jpg);
}
@keyframes menu-hover-transaction-units {
  10% {
    color: #000;
    background: hsl(240, 50%, 50%);
  }
  100% {
    background: hsla(240, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-transaction-units-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/transaction-units"] i {
  color: hsl(240, 50%, 50%);
}
.navbar a[href="/admin/transaction-units"].active {
  color: #000;
  background: hsla(240, 50%, 50%, 0.3);
}
.navbar a[href="/admin/transaction-units"]:focus,
.navbar a[href="/admin/transaction-units"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(240, 50%, 50%), hsl(240, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/transaction-units"]:hover {
  animation-name: menu-hover-transaction-units;
}
.navbar a[href="/admin/transaction-units"]:hover i {
  animation-name: menu-hover-transaction-units-i;
}
body.self-test {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.self-test.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.self-test.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-self-test {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-self-test-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/self-test"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/self-test"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/self-test"]:focus,
.navbar a[href="/admin/self-test"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/self-test"]:hover {
  animation-name: menu-hover-self-test;
}
.navbar a[href="/admin/self-test"]:hover i {
  animation-name: menu-hover-self-test-i;
}
body.sql-studio {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.sql-studio.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.sql-studio.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-sql-studio {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-sql-studio-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/sql-studio"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/sql-studio"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/sql-studio"]:focus,
.navbar a[href="/admin/sql-studio"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/sql-studio"]:hover {
  animation-name: menu-hover-sql-studio;
}
.navbar a[href="/admin/sql-studio"]:hover i {
  animation-name: menu-hover-sql-studio-i;
}
body.settings {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.settings.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.settings.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-settings {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-settings-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/settings"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/settings"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/settings"]:focus,
.navbar a[href="/admin/settings"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/settings"]:hover {
  animation-name: menu-hover-settings;
}
.navbar a[href="/admin/settings"]:hover i {
  animation-name: menu-hover-settings-i;
}
body.bbb {
  --module-hue: 220;
  background-image: url(/themes/tint/220/pumpkins-red.jpg);
}
body.bbb.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/220/pumpkins-red.jpg);
  background-size: cover;
}
body.bbb.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/220/pumpkins-red.jpg);
}
@keyframes menu-hover-bbb {
  10% {
    color: #000;
    background: hsl(220, 50%, 50%);
  }
  100% {
    background: hsla(220, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-bbb-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/bbb"] i {
  color: hsl(220, 50%, 50%);
}
.navbar a[href="/admin/bbb"].active {
  color: #000;
  background: hsla(220, 50%, 50%, 0.3);
}
.navbar a[href="/admin/bbb"]:focus,
.navbar a[href="/admin/bbb"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(220, 50%, 50%), hsl(220, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/bbb"]:hover {
  animation-name: menu-hover-bbb;
}
.navbar a[href="/admin/bbb"]:hover i {
  animation-name: menu-hover-bbb-i;
}
body.active-campaign {
  --module-hue: 240;
  background-image: url(/themes/tint/240/pumpkins-red.jpg);
}
body.active-campaign.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/240/pumpkins-red.jpg);
  background-size: cover;
}
body.active-campaign.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/240/pumpkins-red.jpg);
}
@keyframes menu-hover-active-campaign {
  10% {
    color: #000;
    background: hsl(240, 50%, 50%);
  }
  100% {
    background: hsla(240, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-active-campaign-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/active-campaign"] i {
  color: hsl(240, 50%, 50%);
}
.navbar a[href="/admin/active-campaign"].active {
  color: #000;
  background: hsla(240, 50%, 50%, 0.3);
}
.navbar a[href="/admin/active-campaign"]:focus,
.navbar a[href="/admin/active-campaign"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(240, 50%, 50%), hsl(240, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/active-campaign"]:hover {
  animation-name: menu-hover-active-campaign;
}
.navbar a[href="/admin/active-campaign"]:hover i {
  animation-name: menu-hover-active-campaign-i;
}
body.redmine {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.redmine.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.redmine.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-redmine {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-redmine-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/redmine"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/redmine"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/redmine"]:focus,
.navbar a[href="/admin/redmine"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/redmine"]:hover {
  animation-name: menu-hover-redmine;
}
.navbar a[href="/admin/redmine"]:hover i {
  animation-name: menu-hover-redmine-i;
}
body.pwa {
  --module-hue: 33;
  background-image: url(/themes/tint/33/pumpkins-red.jpg);
}
body.pwa.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/33/pumpkins-red.jpg);
  background-size: cover;
}
body.pwa.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/33/pumpkins-red.jpg);
}
@keyframes menu-hover-pwa {
  10% {
    color: #000;
    background: hsl(33, 50%, 50%);
  }
  100% {
    background: hsla(33, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-pwa-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/pwa"] i {
  color: hsl(33, 50%, 50%);
}
.navbar a[href="/admin/pwa"].active {
  color: #000;
  background: hsla(33, 50%, 50%, 0.3);
}
.navbar a[href="/admin/pwa"]:focus,
.navbar a[href="/admin/pwa"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(33, 50%, 50%), hsl(33, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/pwa"]:hover {
  animation-name: menu-hover-pwa;
}
.navbar a[href="/admin/pwa"]:hover i {
  animation-name: menu-hover-pwa-i;
}
body.users {
  --module-hue: 260;
  background-image: url(/themes/tint/260/pumpkins-red.jpg);
}
body.users.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/260/pumpkins-red.jpg);
  background-size: cover;
}
body.users.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/260/pumpkins-red.jpg);
}
@keyframes menu-hover-users {
  10% {
    color: #000;
    background: hsl(260, 50%, 50%);
  }
  100% {
    background: hsla(260, 50%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-users-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/users"] i {
  color: hsl(260, 50%, 50%);
}
.navbar a[href="/admin/users"].active {
  color: #000;
  background: hsla(260, 50%, 50%, 0.3);
}
.navbar a[href="/admin/users"]:focus,
.navbar a[href="/admin/users"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(260, 50%, 50%), hsl(260, 50%, 50%), transparent, transparent);
}
.navbar a[href="/admin/users"]:hover {
  animation-name: menu-hover-users;
}
.navbar a[href="/admin/users"]:hover i {
  animation-name: menu-hover-users-i;
}
body.media {
  --module-hue: 333;
  background-image: url(/themes/tint/333/pumpkins.jpg);
}
body.media.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/333/pumpkins.jpg);
  background-size: cover;
}
body.media.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/333/pumpkins.jpg);
}
@keyframes menu-hover-media {
  10% {
    color: #000;
    background: hsl(333, 10%, 50%);
  }
  100% {
    background: hsla(333, 10%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-media-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/media"] i {
  color: hsl(0, 0%, 50%);
}
.navbar a[href="/admin/media"].active {
  color: #000;
  background: hsla(333, 10%, 50%, 0.3);
}
.navbar a[href="/admin/media"]:focus,
.navbar a[href="/admin/media"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(333, 10%, 50%), hsl(333, 10%, 50%), transparent, transparent);
}
.navbar a[href="/admin/media"]:hover {
  animation-name: menu-hover-media;
}
.navbar a[href="/admin/media"]:hover i {
  animation-name: menu-hover-media-i;
}
body.editor {
  --module-hue: 333;
  background-image: url(/themes/tint/333/pumpkins.jpg);
}
body.editor.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/333/pumpkins.jpg);
  background-size: cover;
}
body.editor.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/333/pumpkins.jpg);
}
@keyframes menu-hover-editor {
  10% {
    color: #000;
    background: hsl(333, 10%, 50%);
  }
  100% {
    background: hsla(333, 10%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-editor-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/editor"] i {
  color: hsl(0, 0%, 50%);
}
.navbar a[href="/admin/editor"].active {
  color: #000;
  background: hsla(333, 10%, 50%, 0.3);
}
.navbar a[href="/admin/editor"]:focus,
.navbar a[href="/admin/editor"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(333, 10%, 50%), hsl(333, 10%, 50%), transparent, transparent);
}
.navbar a[href="/admin/editor"]:hover {
  animation-name: menu-hover-editor;
}
.navbar a[href="/admin/editor"]:hover i {
  animation-name: menu-hover-editor-i;
}
body.locales {
  --module-hue: 333;
  background-image: url(/themes/tint/333/pumpkins.jpg);
}
body.locales.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/333/pumpkins.jpg);
  background-size: cover;
}
body.locales.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/333/pumpkins.jpg);
}
@keyframes menu-hover-locales {
  10% {
    color: #000;
    background: hsl(333, 10%, 50%);
  }
  100% {
    background: hsla(333, 10%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-locales-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/locales"] i {
  color: hsl(0, 0%, 50%);
}
.navbar a[href="/admin/locales"].active {
  color: #000;
  background: hsla(333, 10%, 50%, 0.3);
}
.navbar a[href="/admin/locales"]:focus,
.navbar a[href="/admin/locales"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(333, 10%, 50%), hsl(333, 10%, 50%), transparent, transparent);
}
.navbar a[href="/admin/locales"]:hover {
  animation-name: menu-hover-locales;
}
.navbar a[href="/admin/locales"]:hover i {
  animation-name: menu-hover-locales-i;
}
body.logout {
  --module-hue: 333;
  background-image: url(/themes/tint/333/pumpkins.jpg);
}
body.logout.compact-sidebar #sidebar {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(/themes/tint/333/pumpkins.jpg);
  background-size: cover;
}
body.logout.compact-sidebar #sidebar:hover {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.7)), url(/themes/tint/333/pumpkins.jpg);
}
@keyframes menu-hover-logout {
  10% {
    color: #000;
    background: hsl(333, 10%, 50%);
  }
  100% {
    background: hsla(333, 10%, 50%, 0.3);
  }
}
/* todo: finish implementing this link */
@keyframes menu-hover-logout-i {
  100% {
    color: #000;
  }
}
.navbar a[href="/admin/logout"] i {
  color: hsl(0, 0%, 50%);
}
.navbar a[href="/admin/logout"].active {
  color: #000;
  background: hsla(333, 10%, 50%, 0.3);
}
.navbar a[href="/admin/logout"]:focus,
.navbar a[href="/admin/logout"].loading {
  background-image: linear-gradient(90deg, transparent, transparent, hsl(333, 10%, 50%), hsl(333, 10%, 50%), transparent, transparent);
}
.navbar a[href="/admin/logout"]:hover {
  animation-name: menu-hover-logout;
}
.navbar a[href="/admin/logout"]:hover i {
  animation-name: menu-hover-logout-i;
}