sì è normale che i figli di un elemento che ha opacità minore di 1, diventino pure loro semi trasparenti. Per risolvere devi far sì che i figli non siano più tali quindi ad esempio affinchè la foto non sia trasparente non deve stare nel contenitore #main che è quello che ha l'opacità. Deve stare fuori, dopo aver chiuso il tag del div #main. Ovviamente, dal punto di vista visivo starà sotto #main ed è per questo motivo che all'immagine devi dare un qualche posizionamento per far sì che visivamente stia nella posizione in cui è adesso (devi quindi "tirarlo su", se mi consenti l'espressione)
Ho iniziato a risponderti e solo dopo ho guardato il codice...la parte centrale è tutta a tabelle...ORRORE!
Questo è il codice corrispondente al titolo Carne Mechada
codice:
<table class="contentpaneopen">
<tbody><tr>
<td width="100%" class="contentheading"><cufon class="cufon cufon-canvas" alt="Carne " style="width: 67px; height: 22px;"><canvas width="83" height="22" style="width: 83px; height: 22px; top: 1px; left: -1px;"></canvas><cufontext>Carne </cufontext></cufon><cufon class="cufon cufon-canvas" alt="Mechada" style="width: 94px; height: 22px;"><canvas width="103" height="22" style="width: 103px; height: 22px; top: 1px; left: -1px;"></canvas><cufontext>Mechada</cufontext></cufon></td>
</tr>
</tbody></table>
Perchè c'è il css in linea? Perchè ti serve una tabella? Così a occhio mi dà l'idea che ci siano anche un sacco di classi e tag ridondanti (quanti cufon??)
E' codice tuo o del template?
Direi decisamente di sfrondare.
Tornando al problema principale, se quella è la tua pagina e sai che non avrà lunghezza maggiore, devi fare un div #main (che a questo punto sarà vuoto) a cui assegnerai una altezza e una larghezza e una opacità. Poi tutti gli altri elementi staranno fuori da questo #main e verranno posizionati con ad esempio un margin-top negativo o con un posizionamento relativo.