Estructura form en .CSS?

Hola,

Mi problema es que tengo en mi código .CSS lo siguiente para la estructura <form>:

Código:

form, .content {
    font-family: Arial, Helvetica, sans-serif; /*Not yet a member? Sign up*/
    width: 30%;
    margin: 0px auto;
    padding: 20px;
    border: 1px solid #595959; /*Border register*/
    background: white;
    /*border-radius: 0px 0px 10px 10px;*/
}

Pero me gustaría que fuese diferente para el botón que tengo:

Código:

<form action="#" method="post">
    <input type="hidden" id="hiddenfield" name="hiddenfield">
    <button class="button" name="search">Search</button>
</form>

Que lo quiero con estas características:

Código:

.button {
    display: block;
    margin: auto; 
    border: none;
    color: black;
    padding: 8px 40px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
}

button:hover {
    background:#333333;
    color: white;
}

Sin embargo, el .CSS de la estructura <form> también se aplica para el botón. Me gustaría diferenciarlo, pero no se como. He probado de varias maneras, entre ellas esta:

Código:

form, .button {
    display: block;
    margin: auto;
    border: none;
    color: black;
    padding: 8px 40px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
}

y he probado a poner

Código:

style="border:none"

al botón pero no consigo quitar el borde.

Me podríais ayudar?
Gracias