Borda da div nao fica transparente por causa do background color

[SeanSIlva 6]

Eu tenho uma div que fica no topo da pagina e fixa. Na teoria ela deveria ter uma borda com trasparencia mas não é isso que aocntece na pratica.

 

No código abaixo da pra ver que eu tive que comentar a linha que aplica a cor de fundo da div por que se eu aplicar um background ela simplesmente não deixa a borda aparecer de forma transparente, porque ao que me parece a cor de fundo que deve ser solida tb fica até o fim da borda, ou seja a cor de fundo da div fica atras da borda tb.

#top_menu{
    /* background: none repeat scroll 0 0 #084090; */
    border-bottom: 10px solid rgba(2, 58, 117, 0.27);
    float: left;
    width: 100%;
    position: fixed;
    z-index: 999;

Fiz uma gambiarra criando outra div no top, tambem fixa, porem com a altura menor.

#gambiarra_topo{
    background: none repeat scroll 0 0 black;
    height: 69px;
    float: left;
    width: 100%;
    position: fixed;
    z-index: -1;
}

Tenho outros layouts que fiz e sempre usei essas bordas e nunca tive problema, mas agora nao entendo o que houve.

 

Achei que pode ser algo como uma herança de div pai pra filho mas nao encontrei nada que pudesser ser isso.

 

Porque a cor de fundo da div tá atrapalhando a borda semi transparente?

 

obs. só da pra ver que a borda fica semi transparente quando a cor de fundo da div tb fica semi transparente.