diff --git a/wiki/static/crans/css/layout.css b/wiki/static/crans/css/layout.css
new file mode 100644
index 00000000..e3466d4e
--- /dev/null
+++ b/wiki/static/crans/css/layout.css
@@ -0,0 +1,326 @@
+/*************************************************************
+                                           ..               
+                      ....  ............   ........         
+                    .     .......   .            ....  ..   
+                  .  ... ..   ..   ..    ..   ..... .  ..   
+                  .. .. ....@@@.  ..  .       ........  .   
+             ..  .  .. ..@.@@..@@.  .@@@@@@@   @@@@@@. .... 
+        .@@@@. .@@@@. .@@@@..@@.@@..@@@..@@@..@@@@.... .... 
+      @@@@... .@@@.. @@ @@  .@..@@..@@...@@@.  .@@@@@.    ..
+    .@@@..  . @@@.   @@.@@..@@.@@..@@@   @@ .@@@@@@..  .....
+   ...@@@.... @@@    .@@.......... ........ .....        .. 
+  . ..@@@@.. .         .@@@@.   .. .......  . ............. 
+ .   ..   ....           ..     .. . ... ....               
+.    .       ....   ............. .. ...                    
+..  ..  ...   ........ ...      ...                         
+ ................................   
+
+==============================================================
+layout.css - MoinMoin Style                                                                                                     
+
+    Theme crans, layout principal (screen)
+    
+
+Copyright (c) 2006 by www.crans.org
+
+**************************************************************/	  
+/*<!-- BODY -->*/
+body, html{
+    padding:0;
+    margin:0;
+}
+
+div#page
+{
+    position:relative;
+    margin:40px 170px 0 0;
+    padding:0;
+}
+
+div#content
+{
+    position:relative;
+    padding:0 15px 0 15px;
+    /*background-image: url("../img/fond.png");*/
+    background-color: transparent;
+    background-repeat: no-repeat;
+    background-position: center center;
+    background-attachment: fixed;
+    min-height:500px;
+}
+
+/* ****************************** BARRE DE TITRE ****************************** */
+div#titleBarre {
+    float:right;
+    z-index:5;
+    position: fixed;
+    left: 0;
+    top: 0;
+    padding:0;
+    margin:0;
+    height: 40px;
+    width:100%;
+    border-bottom: thin solid #fcedd6;
+    background: url(../img/barreViole.png) repeat-x;
+    text-align:left;
+}
+/* on change la couleur des soulignements de titres pour aller avec la barre */
+h1, h2, h3, h4, h5, h6 {border-color: #fcedd6}
+
+div#titleBarre *,
+div#titleBarre h1#title a  {
+    color: white;
+    font: 25px "Trebuchet MS", helvetica, sans-serif ;    
+    text-decoration:none;
+}
+
+h1#title
+{
+    /* pour ie */
+    position:absolute;
+    top:0;
+    /* fin pour ie */
+    margin: 0;
+    display:block;
+    width:100%;
+    height:40px;
+    padding:0;
+    background: url(../img/logoViole.png) no-repeat right top;
+    border:none;
+}
+ul#pagelocation {
+    list-style-type:none;
+    height:25px;
+    padding:5px 10px 10px 10px;
+    margin:0;
+    float:left;
+}
+ul#pagelocation li {
+	display:inline;
+	float:left;
+}
+
+ul#pagelocation li:before{
+	content:"/";
+	color:white;
+	
+}
+h1#title>a{
+	margin:10px;
+	display:block;
+	height:25px;
+	padding:0;
+	vertical-align:middle;
+	
+}
+
+/* ****************************** MENU DE DROITE ****************************** */
+
+div#column-one ul, div#column-one li {                    
+	/* utilisation de liste pour le menu */
+    list-style-type: none;  /* suppression des puces de liste */
+    margin:0;
+    padding:0;
+}
+
+div#column-one {
+    /* position */
+    z-index:2;
+    position: absolute;
+    right:0;
+    top:41px;
+    /* dimensions */
+    padding:5px 10px 10px 10px;
+    width:150px;
+    //height:100%;
+    overflow:hidden;
+    margin:0px;
+    /* texte */
+    font: 0.9em "Trebuchet MS", helvetica, sans-serif;
+    text-align:left;
+    /* couleurs */
+    background:#eeeeee;
+    border-left:thin solid #bbbbbb;
+    border-bottom:thin solid #bbbbbb;
+}
+
+/* des lignes de separation entre les sections */
+div#column-one form#searchform:after,
+div#column-one ul:after {
+    content:url(../img/Separator.png);
+    display: block;
+    text-align: center;
+    margin:2px auto;
+}
+ 
+/* sauf pour le dernier */
+div#column-one ul#credits:after {
+    content: '';
+}
+
+/* style des liens */
+div#column-one li a,
+div#column-one li a:hover {
+    margin:2px;
+    text-decoration: none;
+    color:#777777;
+}
+div#column-one li a:hover {
+    text-decoration: underline;
+}
+
+div#column-one li span.disabled {
+    margin:2px;
+    color:#999999;
+}
+div#column-one li span.disabled:before {
+    content:"/!\\ ";
+}
+
+/* style des menus deroulants */
+div#column-one select {
+  width:152px;
+  margin: 5px 0;
+  border: thin gray solid;
+  font-size: 0.9em;
+}
+
+/* divers */
+#credits {
+	margin-bottom:0;
+	text-align: center;
+	font-size: 0.88em;
+}
+#credits li { display: inline;}
+div#p-logo {
+    display:none;
+}
+
+/* titres de sections */
+div#column-one h5 {
+    margin:2px;
+    text-decoration:none;
+    font-size:1em;
+    font-weight:bold;
+}
+
+/* champ de recherche */
+#searchinput {
+  padding: 2px 2px 2px 18px;
+  background: #fff url(../img/q.png) no-repeat 4px center;
+  width:132px;
+  font: 0.9em "Trebuchet MS", helvetica, sans-serif;
+  border:thin gray solid;
+  margin: 5px 0;
+
+}
+
+/* ********************************** DIVERS ********************************** */
+#timings { display: none;}
+
+
+
+/* ***************************** EDITEUR DE TEXTE ***************************** */
+textarea {
+    width: 95%;
+}
+#preview {
+	border: 1px solid #6C7680;
+	padding: .5em;
+	background: url(../img/draft.png);
+}
+
+/* *********************************** DIFF *********************************** */
+.diff {
+	width:99%;
+}
+
+.diff-header {
+	font-weight: bold;
+}
+
+.diff-title {
+	background-color: #C0C0C0;
+}
+
+.diff-added {
+	background-color: #E0FFE0;
+	vertical-align: sub;
+}
+
+.diff-removed {
+	background-color: #FFFFE0;
+	vertical-align: sub;
+}
+
+.diff-added span {
+	background-color: #80FF80;
+}
+
+.diff-removed span {
+	background-color: #FFFF80;
+}
+
+/* ********************************* MESSAGES ********************************* */
+#message {
+	clear: both;
+	margin: 40px 170px 0 0;
+	padding: 5px 0px;
+	border-bottom: 1px solid #c9c9c9;
+	background: #E6EAF0;
+	font-size: 0.9em;
+}
+
+#message p{
+	margin: 0;
+	padding: 0 10px 0 20px;
+	font-weight: bold;
+}
+
+#message div.buttons {
+	font-weight: lighter;
+	padding: 0 0 0 30px;
+}
+
+
+/* Collection de hacks à la con pour IE */
+@media screen {
+/*  
+ * html {
+     overflow: hidden;
+  }
+/**/
+/*  * html body {
+     overflow-y: auto;
+     height: 100%;
+     //padding: 44px 160px 0 1em;
+     font-size: 100%;
+  }
+/**/
+/*  * html body {
+     overflow: hidden;
+     height: 100%;
+  }
+  * html body #page {
+     overflow: auto;
+     height: 100%;
+  }
+
+/**/
+  * html div#column-one {
+     position: absolute;
+  }
+/**/
+  * html h1#title
+  { 
+    position: absolute;
+    width: expression(document.body.clientWidth);
+  }
+
+  * html div.portlet, * html #editbar
+  { 
+    padding-bottom: 1.5em;
+  }
+
+}
+/**/