Site extensible en hauteur

Bonjour à tous,

Dans le cadre de mes TPE, je suis en train de créer un site pour le projet étudier.
Ce site est partiellement terminé mais il me reste encore pas mal de bugs à corriger, notamment celui que je voudrais réparer le plus vite possible : celui de l'extensibilité en hauteur de mon design.
Je vous présente mon design : http://tpe.unlimited-studio.com/
J'aimerais que lorsque l'écriture qui est dans le contenu blanc arrive à la limite du footer, le contenu s'allonge pour pouvoir recevoir le texte et pas empiété sur le footer.
Je cherche depuis quelques herures mais ne trouve pas de réelles solutions à ce problème : j'ai déjà créé une image de 1px qui va servir a étendre le design qui est consultable là : http://tpe.unlimited-studio.com/images/wrapper.png

En fait j'aimerais que le bas du menu (c'est-à-dire la partie bleu sans les liens, évidemment) ainsi que le contenu s'allongent ensemble.
Je ne trouve pas du tout comment faire :-/
Je vous laisse mon fichier HTML ainsi que mon fichier CSS :
HTML : http://pastebin.com/m50e03260
CSS : http://pastebin.com/m1e9d2c92
Je sais que j'ai pas codé n'importe comment :p mais je ne fais pas ça pour que ce soit le plus léger et le plus ergonomique possible mais plutôt pour moins me prendre la tête (fainéantise, fainéantise... :)).

Merci d'avance pour votre aide,
Unlimited.