what happening with this CSS3? i can't find it

Question

i have made a button with some effects. When i tested in browser it's working fine in only in mozilla. i am unable to find why is not working in -webkit- browser can anybody tell me why this code is not working check this fiddle http://jsfiddle.net/sarfarazdesigner/Qtw3x/

here is html code

<button name="feat-btn" id="feat-btn" class="push-button" type="submit">
    <span>Submit</span>
</button>

here is css

.push-button {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    padding: 0;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
}
.push-button span:after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #357536 transparent -moz-use-text-color;
    border-image: none;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-style: solid solid none;
    border-width: 5px 5px 0;
    content: "";
    display: block;
    margin: 0 -1.7em;
    overflow: hidden;
    text-indent: -9999px;
}
.push-button span:before {
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    content: ".";
    display: block;
    height: 55px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}
.push-button span {
    background-color: #4FB051;
    border-bottom: 1px solid #6FBE70;
    display: inline-block;
    height: 49px;
    line-height: 50px;
    margin-bottom: 5px;
    min-width: 110px;
    padding: 0 1.7em;
    position: relative;
}
.push-button:hover  span{background-color:#52a853;}

first check it in mozilla then you understand how it will look or you can see the image below this is looking in mozilla

and this is looking in webkit browser

Answer 1

Something weird is going on with your border-color in the .push-button span:after selector

border-color: #357536 transparent -moz-use-text-color;

Just change it to #357537

jsFiddle

border-color: #357536;

Works in both Chrome and Firefox for me with that change.