/* Orange variant of pushable buttons */
button.pushable.orange .front,
a.pushable.orange .front {
  background: none !important;
  background-color: #ff8c1a !important;
  background-image: linear-gradient(to bottom, #ff9f40, #ff8c1a, #ff7400, #e66800) !important;
  border-color: #ffb366 !important;
  box-shadow: 0 10px #cc5c00 !important;
  color: white !important;
  border: none !important;
}

button.pushable.orange .edge,
a.pushable.orange .edge {
  background: none !important;
  background-image: linear-gradient(
    to right,
    #ff9f40 0%,
    #ff8c1a 8%,
    #ff7400 92%,
    #e66800 100%
  ) !important;
}

button.pushable.orange .shadow,
a.pushable.orange .shadow {
  background: #cc5c00 !important;
}

/* Hover state */
button.pushable.orange:hover .front,
a.pushable.orange:hover .front {
  background: none !important;
  background-image: linear-gradient(
    to bottom,
    #ffae59 0%,
    #ff9933 25%,
    #ff8519 75%,
    #ff7519 100%
  ) !important;
}

/* Make sure specificity is high enough */
body .pushable.orange .front,
html .pushable.orange .front {
  background-image: linear-gradient(
    to bottom,
    #ff9f40 0%,
    #ff8c1a 25%,
    #ff7400 75%,
    #e66800 100%
  ) !important;
}