What are the steps to create new icons like the ones in the shipping css? I tried copying an existing one then made minor changes to one like this:

HTML Code:
      .x-button-plain.x-button-mask img.play, .x-toolbar .x-button-plain.x-button-mask img.play,
      .x-button-plain.x-button-pressed.x-button-mask img.play, .x-toolbar .x-button-mask.x-button-mask img.play, .x-button-mask.x-button-mask img.play
       {
        -webkit-mask-box-image: url('next.png'); 
       }
Am I missing something?