在wordpress的菜单项上添加了自定义类，但悬停不起作用吗？

Question

我最近在我的wordpress菜单中创建了一个菜单项，该菜单项的样式有所不同，因此它看起来像一个号召性用语按钮，适用于导航项。

我转到菜单>然后是CSS类（在项目上）并添加了callout-button

然后我将以下内容添加到主题自定义CSS中，

.callout-button a {
  background-color: #8E3D86;
  color: #fff !important;
  border-radius: 8px;
}

.callout-button a:hover {
  background-color: #b8b8b8 !important;
  border: 1px solid #8E3D86;
  -webkit-transition: all 400ms;
  transition: width all 400ms;
}

.callout-button a:after {
  display: none !important;
}

现在这可以正确设置按钮的样式，但是:hover无法正常工作，背景颜色没有改变，并且还添加了额外的边框（这是我的常规菜单css的一部分）

有人对我如何使它覆盖普通菜单CSS有任何想法吗？