TP : Ajouter un media-queries pour les écrans de moins de 685px

Voici deux copies d'écran de la même page, la première pour un écran de largeur supérieure à 685px :

la seconde pour un écran de largeur inférieure à 685px :

La première page vous est entièrement livrée ici. Le css n'est pas conditionné par un media-queries, faites varier la largeur de votre fenêtre : rien ne s'adapte.

On vous demande d'ajouter un media queries avec des css venant contredire les instructions initiales afin d'obtenir la copie d'écran ci-dessous (On ne touche pas au CSS initial contenu dans la page livrée, on rajoute du CSS sous un conditionnement de media-queries). Voici quelques conseils :

  1. la div #main devra avoir cette fois une largeur auto et non plus fixe
  2. les div de classe .entry_preview (chaque vignette) devront aussi être de largeur libre, ainsi que la hauteur, elle ne devront plus flotter. Elle devront prendre la largeur de l'écran en étant de display block.
  3. Les photos (.entry_preview .thumb) devront cette fois être flottante gauche et d'un largeur maximale de 50% de son container (.entry_preview)
  4. On pourra affiner en ajuster partout les padding