I am trying to create my own custom button and display it in a panel. I can currently display a button with an icon but I want my own button and icon. here is how far I have gotton

halfimage.png

and my code for the button is

Code:
this.alertsIcon = new Ext.Button({
    iconCls: 'alertIcon',
    icon: 'http://localhost/coachesApp/sencha-touch-1.1.0/examples/coachesapp/src/resources/images/dash_icon_alerts.png',
    ui: 'plain',
    height: 70,
    width: 70,
    scope: this,
    handler: this.alertClick
});
and here is my css code

Code:
.alertIcon {
    -webkit-mask-image: url(../images/dash_icon_alerts.png);
    -webkit-mask-size: 70px 70px;
}
so as you can see with the image I am not getting the full icon I have created, what I want the icon should look like is the image below, but I am having trouble getting the full icon to display.


asd.png