Angular Material Custom Class Button Issue

I am trying to write a custom class for angular material button, but there is one issue with that, when I click on the button and move away(minimize or activate another window) from the browser, it fades out or makes it white and when I click on the browser window then it turns to proper shape/color, don't know the reason but how to control this does any one have any idea. My Css Class:

.DeleteBtn.md-raised {
  color: #fff;
  background-color: #CC090F;
  text-transform: initial;
  min-width: 88px;
  margin: 6px 0px;
  max-width: 8px;
  font-size: 12px;
}

.DeleteBtn.md-raised:not([disabled]):hover {
  color: #fff;
  background-color: #7F0509;
  max-width: 10px;
  font-size: 12px;
}

<md-button class="md-raised DeleteBtn">Delete</md-button>