Tenho o seguinte CSS que estiliza o link em uma das minhas páginas:

a:link, a:visited, a:active {
    color: white;
    text-decoration: none;
    font-weight: bold;
}

No entanto, quando carrego, eles aparecem azuis no Chrome e brancos no Firefox. As ferramentas de desenvolvimento do Chrome revelam que meu estilo substitui a folha de estilo do agente do usuário:

Por que ele não está sendo exibido corretamente? Tentei definir o conjunto de caracteres na parte superior da minha folha de estilo:

@charset "UTF-8";

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    font: 11px "Lucida Grande", Arial, Sans-serif;
}

a:link, a:visited, a:active {
    color: white;
    text-decoration: none;
    font-weight: bold;
}

input[type=email], input[type=password] {
    display: block;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border: 1px solid #ACE;
    font-size: 13px;
    margin: 0 0 5px;
    padding: 5px;
    width: 203px;
}

Mas não ajudou. Minha folha de estilo está vinculada na cabeça com:

<link href="/assets/global.css?body=1" media="screen" rel="stylesheet"
type="text/css">

E o código html para os links:

<a href="/users/sign_in">Sign in</a>
<a href="/users/password/new">Forgot your password?</a>
<a href="/users/auth/facebook">Sign in with Facebook</a>

Este é o aspeto deles no Chrome (13.0.782) - incorreto:

É assim que eles se parecem no Firefox - correto:

Parece que a folha de estilo do agente do usuário está substituindo o meu estilo. Por quê