Java Development Tools

I need to change the style for af:button when it takes the focus (tab key) but I couldn't get it.

I have create my custom skin extending skyros.v1.desktop.

This is part of my css file:

af|button:focus {
    color: #333333;
    border-top: 1px solid #E2CB9B;
    border-right: 1px solid #E2CB9B;
    border-bottom: 1px solid #D4BB87;
    border-left: 1px solid #E2CB9B;
}


@agent mozilla {
    af|button:focus {
        background-image: -moz-linear-gradient(top, #FFE4A8 0%, #FFD475 100%);
    }
}


@agent webkit {
    af|button:focus {
        background-image: -webkit-linear-gradient(top, #FFE4A8 0%, #FFD475 100%);
    }
}


@agent ie {
    af|button:focus {
        background-image: -ms-linear-gradient(top, #FFE4A8 0%, #FFD475 100%);
    }
}

The error is that, button never takes the focus property when  the user push the key tab.

I have tested with chrome browser, and If I toogle the focus event for the div, It works.

This is the html code generated for the af:button component.

<div id="ptb1:r1:0:cb2" class="xg5 p_AFTextOnly" _afrgrp="0"><a href="#" onclick="this.focus();return false" class="xg7"><span class="xgf">Acceder</span></a></div>

Development: jdeveloper 12c (12.1.2.0).