.boton {
    --bot-tam: 20px;
    --bot-img: none;
    width: var(--bot-tam);
    height: var(--bot-tam);
    display: inline-block;
    padding: 0;
    margin: 0;
    border: 0;
    background-color: transparent;
    background-image: var(--bot-img);
    background-repeat: no-repeat;
    background-size: var(--bot-tam) calc(var(--bot-tam) * 4);
    background-position: 0 calc(var(--bot-tam) * -1);
	vertical-align: middle;
    cursor: pointer;
}

.boton:hover:not(:disabled) {
    background-position: 0 calc(var(--bot-tam) * -2);
}

.boton:active:not(:disabled) {
    background-position: 0 calc(var(--bot-tam) * -3);
}

.boton:disabled {
    background-position: 0 0;
    cursor: default;
}

.boton:focus-visible {
    background-position: 0 calc(var(--bot-tam) * -2);
    outline: 2px solid currentColor;
    outline-offset: 2px;
}