a un primo sguardo noto che il div #foto NON è posizionato, ma anzi è impostato con un float-right.
Considera che z-index si applica a elementi posizionati mentre uno flottante è esattamente il suo contrario, dal momento che viene tolto dal naturale flusso degli elementi sulla pagina.