Cambiando aspecto de input

[ramiro_md]

Buenas, estoy tratando de cambiar el aspecto a unos inputs, en base a imágenes que descargué en un PSD.
Las imágenes ya las tengo preparadas, y en mi css configuré así los inputs:

Código CSS:

input.login{ border: none; width: 486px; height: 66px; background-image: url('img/input-normal.png') no-repeat; font-family: Tahoma, Verdana; font-size: 32pt;  color: #a6a6a6; }
 
input.login:focus{ width: 492px; height: 74px; background-image: url('img/input-active.png') no-repeat; }
 

Mi HTML:

Código HTML:

<div class="form">
                <form>
                    <input class="login" type="text" value=" su usuario" />
                    &nbsp;
                    <input class="login" type="password" value=" su clave" />
                    <button class="tables" style="float: right; margin-top: 7%;"></button>
                </form>
            </div>
 

El problema es que si bien, algunas propiedades que configuré en el css, son aplicadas correctamente, por ejemplo las fuentes y el tamaño del input. El principal atributo no lo toma. Dejandome un input normal, pero sin bordes.
Tenía entendido que haciendo esos retoques bastaba. Se ve que no. Alguien sabría decirme que estoy haciendo mal ?.
Desde ya muchas gracias.