borde redondeado div repeat-x

[sandrox23]

Hola a todos, tengo una barra que tiene dos gif transparentes a los costados, resulta que no encuentro al manera que se vean los bordeados del costado ya que el .tcat usa una imagen de fonde que lo tapa.

este es el codigo:

Código CSS:

.tcat {
    background:url(tcatBG.gif) repeat-x top left;
    color: #c5c5c5;
    height:35px;
    clear:both;
    margin-top: 8px;
    float: left;
    border:0;
    padding:0;
    width: 100%;
}
.tcatLeft {
    background:url(tcatLeft.gif) no-repeat top left;
    height:35px;
}
.tcatRight {
    background:url(tcatRight.gif) no-repeat top right;
    height:35px;
    position:relative;
}
 

Código HTML:

<div class="tcat">
    <div class="tcatLeft"><div class="tcatRight">
contenido
</div></div>
</div>
 

ah ver si me dan ideas de como hacer que se vean los bordeados, Gracias

dejo adjunto la imagen de como se ve el disenio.



pueden ver aqui el ejemplo:

http://jsfiddle.net/jim3481/72bGk/1/