bio: Early life and short

Signed-off-by: Martin Richard <martius@martiusweb.net>

bio.html

@@ -91,14 +91,38 @@ <h2>The Dark Knight Rises</h2>
     <aside><img src="images/nolan_portrait1.jpg" alt="Poster de Following"></aside>
     <article>
       <h2>Jeunesse</h2>
-      <p>TODO</p>
+      <p>Voici quelques faits à son sujet&nbsp;:</p>
+      <p>Christopher Nolan est né le 20 juillet 1970 à Londres.</p>
+      <p>Il est diplomé de l'<span lang="en">University College of London</span>
+      (UCL), de littérature anglaise. Il n'a pas fait d'études dédiées au
+      cinéma, mais d'après un de ses camarades de l'époque, il aurait choisi
+      cette université pour son club de cinéma bien équipé. Il a presidé ce club
+      pendant quatre ans.</p>
+      <p>Il a commencé sa carrière comme réalisateur de vidéos de formation pour
+      des entreprises.</p>
+      <p>Il est marrié avec Emma Thomas, qu'il a rencontré alors qu'il était
+      étudiant à UCL. Ils ont quatre enfants.</p>
     </article>
   </section>
   <section>
     <aside><img src="images/posters/doodlebug.jpg" alt="Poster de Following"></aside>
     <article>
       <h2>Court-métrages</h2>
-      <p>TODO</p>
+      <p>Christopher Nolan réalisera plusieurs court-métrages qui seront
+      diffusés publiquement. On en connait notamment trois.</p>
+      <p><em>Tarantella</em> (1989) est aujourd'hui introuvable, a a été diffusé
+      à la télévision aux États-Unis.</p>
+      <p><em>Lacerny</em> (1996) est également introuvable, est un court-métrage
+      réalisé dans le cadre du club de cinéma d'UCL. On peut le voir comme un
+      premier essai pour son premier long-métrage&nbsp;: les deux partagent des
+      éléments de scénario et l'acteur principal.</p>
+      <p><em>Doodlebug</em> (1997) dure trois minutes, il met en scene une
+      personne essayant de tuer un insecte avec une chaussure. Sans en dire trop
+      (regardez-le&nbsp;!), le film montre que Christopher Nolan aime les
+      casse-têtes.</p>
+      <p>On peut le voir sur <a
+        href="http://www.youtube.com/watch?v=-WhKt_CkXD0"
+        onclick="window.open(this.href); return false;">Youtube</a>.
     </article>
   </section>
   <section>

css/style.css

@@ -490,7 +490,10 @@ body.home {
   -moz-box-sizing: border-box;
   -wekit-box-sizing: border-box;
   overflow: hidden;
-  padding: 6% 150px;
+  height: 410px;
+  position: absolute;
+  top: 50%;
+  margin-top: -155px;
 }
 
 #scene > div {
@@ -500,6 +503,10 @@ body.home {
 #scene section {
   display: table;
   float: left;
+  padding: 0 150px;
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -wekit-box-sizing: border-box;
 }
 #scene section aside, #scene section article {
   display: table-cell;