.power-menu {
  background-color: $bg;
  border: 3px solid $menu-border;
  border-radius: 32px;

  .power-menu-item {
    font-size: 44px;
    background-color: $bg;
    border-radius: 20px;
    border: 1px solid $menu-border;
    margin: 16px 0;
    margin-right: 16px;
    padding-right: 4px; /* this makes sure icons from nerd font are centered */
    transition:
      background-color 0.4s ease,
      color 0.4s ease;
    color: $fg;

    &:hover {
      background-color: $fg;
      color: $bg;
    }

    &.first {
      margin-left: 16px;
    }
  }
}