diff --git a/jquery/databap.js b/jquery/databap.js
index c4251c3..a8423c9 100644
--- a/jquery/databap.js
+++ b/jquery/databap.js
@@ -205,16 +205,17 @@ function Databap()
 			
 			//Expand menu
 			self.$menu
-			.stop()
-			.animate
-			(
-				{width:'300px'/*, borderWidth:'10px'*/}, 
-				'fast',
-				function()
-				{
-					self.$menu.find('#menu_box').show('fast');
-				}
-			);
+				.stop()
+				.animate
+				(
+					{width:'300px'/*, borderWidth:'10px'*/}, 
+					'fast',
+					function()
+					{
+						self.$menu.find('#menu_box').show();
+						$(this).addClass('opened');
+					}
+				);
 		}
 	};
 	
@@ -242,16 +243,17 @@ function Databap()
 			//Reduce menu
 			self.$menu.find('#menu_box').hide();
 			self.$menu
-			.stop()
-			.animate
-			(
-				{width:'20px'/*, borderWidth:'0'*/},
-				'fast', 
-				function()
-				{
-					self.$menu.find('#menu_title').show('fast');
-				}
-			);
+				.stop()
+				.animate
+				(
+					{width:'20px'/*, borderWidth:'0'*/},
+					'fast', 
+					function()
+					{
+						self.$menu.find('#menu_title').show();
+						$(this).removeClass('opened');
+					}
+				);
 			openedMenu = false;
 			closeMenu = false;
 		}
diff --git a/masks/index.html b/masks/index.html
index 40d0681..fc08e95 100755
--- a/masks/index.html
+++ b/masks/index.html
@@ -40,22 +40,22 @@
 			</table>
 		</div>
 		<div id="menu" class="round">
-			<div id="menu_title"><p>m</p><p>e</p><p>n</p><p>u</p></div>
+			<div id="menu_title"><i class="fa fa-c-next"></i></div>
 			<div id="menu_box">
-				<h1 class="title">databap</h1>
 				<ul id="menu_items">
-					<li><a href="#accueil"><i class="fa fa-fw fa-20 fa-c-welcome"></i>Accueil</a></li>
-					<li><a href="#code"><i class="fa fa-fw fa-20 fa-c-code"></i>Ajouter du code</a></li>
-					<li><a href="#procedure"><i class="fa fa-fw fa-20 fa-c-procedure"></i>Ajouter une proc&eacute;dure</a></li>
-					<li><a href="#table"><i class="fa fa-fw fa-20 fa-c-table"></i>Ajouter une table</a></li>
-					<li><a href="#doc"><i class="fa fa-fw fa-20 fa-c-doc"></i>Ajouter une doc</a></li>
-					<li><a href="#liste"><i class="fa fa-fw fa-20 fa-c-list"></i>Liste compl&egrave;te</a></li>
-					<li><a href="#profil"><i class="fa fa-fw fa-20 fa-c-profile"></i>Profil</a></li>
-					<li><a href="#chat"><i class="fa fa-fw fa-20 fa-c-chat"></i>Chat</a></li>
-					<li><a href="#options"><i class="fa fa-fw fa-20 fa-c-options"></i>Paramètres</a></li>
-					<li><a href="[#]rss_link[#]" target="_blank"><i class="fa fa-fw fa-20 fa-c-rss"></i>Flux Rss</a></li>
-					<li><a href="#logout"><i class="fa fa-fw fa-20 fa-c-logmeout"></i>Quitter</a></li>
-					<li class="mobile"><a id="close_menu_ln"><i class="fa fa-fw fa-20 fa-c-fold"></i>Fermer</a></li>
+					<li><i class="fa fa-fw fa-20 fa-c-next fa-rotate-90"></i>menu</li>
+					<li><a href="#accueil"><i class="fa fa-fw fa-20 fa-c-welcome"></i>accueil</a></li>
+					<li><a href="#code"><i class="fa fa-fw fa-20 fa-c-code"></i>ajouter du code</a></li>
+					<li><a href="#procedure"><i class="fa fa-fw fa-20 fa-c-procedure"></i>ajouter une proc&eacute;dure</a></li>
+					<li><a href="#table"><i class="fa fa-fw fa-20 fa-c-table"></i>ajouter une table</a></li>
+					<li><a href="#doc"><i class="fa fa-fw fa-20 fa-c-doc"></i>ajouter une doc</a></li>
+					<li><a href="#liste"><i class="fa fa-fw fa-20 fa-c-list"></i>liste compl&egrave;te</a></li>
+					<li><a href="#profil"><i class="fa fa-fw fa-20 fa-c-profile"></i>profil</a></li>
+					<li><a href="#chat"><i class="fa fa-fw fa-20 fa-c-chat"></i>chat</a></li>
+					<li><a href="#options"><i class="fa fa-fw fa-20 fa-c-options"></i>paramètres</a></li>
+					<li><a href="[#]rss_link[#]" target="_blank"><i class="fa fa-fw fa-20 fa-c-rss"></i>flux Rss</a></li>
+					<li><a href="#logout"><i class="fa fa-fw fa-20 fa-c-logmeout"></i>quitter</a></li>
+					<li class="mobile"><a id="close_menu_ln"><i class="fa fa-fw fa-20 fa-c-fold"></i>fermer</a></li>
 				</ul>
 			</div>
 			<a href="[#]index_link[#]" class="useless_button round" title="The Secret Useless Button"></a>
diff --git a/masks/welcome.html b/masks/welcome.html
index 49b980e..cc573df 100755
--- a/masks/welcome.html
+++ b/masks/welcome.html
@@ -3,7 +3,13 @@
 		<p class="welcome_text">Bienvenue sur la plateforme Databap</p>
 		<div id="welcome_box"><div id="welcome_subbox">
 		<ul class="fa-ul">
-			<li><i class="fa-li fa fa-30 fa-c-ok"></i>Version <span id="version"></span> (maj du <span id="version_date"></span>)</li>
+			<li><i class="fa-li fa fa-30 fa-c-version"></i>Databap version <span id="version"></span>
+				<ul class="fa-ul">
+					<li><i class="fa-li fa fa-c-details fa-rotate-180"></i>Version <span id="version_main"></span>, EHP <span id="version_ehp"></span>, SP <span id="version_sp"></span></li>
+					<li><i class="fa-li fa fa-c-date"></i>Commit du <span id="version_date"></span></li>
+					<li><i class="fa-li fa fa-c-git"></i>Repo git disponible ici: <a href="http://gitweb.lutran.fr/?p=databap.git;a=shortlog" target="_blank">databap.git</a></li>
+				</ul>
+			</li>
 			<li><i class="fa-li fa fa-30 fa-c-changelog"></i>Changelog
 				<ul class="fa-ul">
 					<li><i class="fa-li fa fa-c-checked"></i>Utilisation des # pour les accès aux pages, compatible avec les boutons prec/suiv des navigateurs. Ex: <a href="#chat">databap.lutran.fr#chat</a></li>
@@ -23,12 +29,15 @@
 			</li>
 			<li><i class="fa-li fa fa-30 fa-c-wip"></i>In progress
 				<ul class="fa-ul">
+					<li><i class="fa-li fa fa-c-unchecked"></i>Filtre par type de documents (table, code, procédure, ...) applicable post-recherche (affinage)<span class="round milestone"><i class="fa fa-c-version"></i>1.1.0</span></li>
+					<li><i class="fa-li fa fa-c-unchecked"></i>Son lors de nouveaux messages (chat)</li>
 					<li><i class="fa-li fa fa-c-unchecked"></i>Version compatible mobile (surtout pour le chat)</li>
-					<li><i class="fa-li fa fa-c-unchecked"></i>Version compatible IE8+</li>
-					<li><i class="fa-li fa fa-c-unchecked"></i>Recherche avanc&eacute;e : expressions r&eacute;guli&egrave;res, version de document</li>
-					<li><i class="fa-li fa fa-c-unchecked"></i>Messagerie interne</li>
+					<li><i class="fa-li fa fa-c-unchecked"></i>Accès externe à certains fichiers (partage temporaire)</li>
+					<li><i class="fa-li fa fa-c-unchecked"></i>Messagerie interne afin d'envoyer des mails aux personnes absentes<span class="round milestone"><i class="fa fa-c-version"></i>1.2.0</span></li>
 					<li><i class="fa-li fa fa-c-unchecked"></i>Q&amp;A (forum like)</li>
 					<li><i class="fa-li fa fa-c-unchecked"></i>Image de profil</li>
+					<li><i class="fa-li fa fa-c-unchecked"></i>Système de rewards pour les documents ajoutés (table, code, procédure, ...)<span class="round milestone"><i class="fa fa-c-version"></i>1.3.0</span></li>
+					<li><i class="fa-li fa fa-c-unchecked"></i>Version compatible IE8+</li>
 				</ul>
 			</li>
 			<li><i class="fa-li fa fa-30 fa-c-mail"></i><a href="mailto:francois@lutran.fr">Me contacter</a>, car toute idée est bonne à prendre !</li>
@@ -39,7 +48,12 @@
 <script type="text/javascript">
 databap.pageInit = function()
 {
-	$('#version').text(databap.consts.version);
+	var sVersion = databap.consts.version;
+	var asVersionDetails = sVersion.split('-')[0].split('.');
+	$('#version').text(sVersion);
+	$('#version_main').text(asVersionDetails[0]);
+	$('#version_ehp').text(asVersionDetails[1]);
+	$('#version_sp').text(asVersionDetails[2]);
 	$('#version_date').text(databap.consts.version_date);
 	self.initScrollBar('#main', '#welcome_box', '#welcome_subbox');
 
diff --git a/style/screen.css b/style/screen.css
index 48980de..a2c99c6 100644
--- a/style/screen.css
+++ b/style/screen.css
@@ -1,10 +1,11 @@
 /* Colors */
 
 /*
-	SAP blue : #04357B
-	SAP New blue : #0C8BCE
-	SAP orange : #EFAB00
-	SAP bright blue : #D9E5F2
+	SAP Blue: #04357B
+	SAP New blue: #0C8BCE
+	SAP Orange: #EFAB00
+	SAP Bright blue: #D9E5F2
+		Bright blue 2: #DCF2FB
 */
 
 /* General */
@@ -200,13 +201,6 @@ img {
 	font-size:13px;
 }
 
-.title {
-	font-weight:bold;
-	font-size:30px;
-	text-transform:uppercase;
-	letter-spacing:-4px;
-}
-
 .default_text {
 	color:#D9E5F2 !important;
 }
@@ -599,23 +593,14 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	content: "\f14c";
 }
 
-.fa-c-list {
-	color:#04357B;
-}
 .fa-c-list:before {
 	content: "\f02d";
 }
 
-.fa-c-profile {
-	color:#04357B;
-}
 .fa-c-profile:before {
   content: "\f007";
 }
 
-.fa-c-chat {
-	color:#04357B;
-}
 .fa-c-chat:before {
 	content: "\f086";
 }
@@ -624,6 +609,22 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	content: "\f0e7";
 }
 
+.fa-c-version:before {
+	content: "\f005";
+}
+
+.fa-c-details:before {
+	content: "\f112";
+}
+
+.fa-c-date:before {
+	content: "\f073";
+}
+
+.fa-c-git:before {
+	content: "\f1d3";
+}
+
 .fa-c-afk:before {
 	content: "\f017";
 }
@@ -635,9 +636,6 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	content: "\f075";
 }
 
-.fa-c-options {
-	color:#04357B;
-}
 .fa-c-options:before {
 	content: "\f085";
 }
@@ -650,16 +648,10 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	content: "\f013";
 }
 
-.fa-c-rss {
-	color:#04357B;
-}
 .fa-c-rss:before {
   content: "\f09e";
 }
 
-.fa-c-logmeout {
-	color:#04357B;
-}
 .fa-c-logmeout:before, .fa-c-logout:before {
   content: "\f08b";
 }
@@ -1305,27 +1297,35 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	padding:10px 0;
 	z-index:10;
 	border-right:0 solid #04357B;
+	
+	background: rgb(217,229,242);
+	background: -moz-linear-gradient(top,  rgba(217,229,242,1) 0%, rgba(255,255,255,1) 25%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(217,229,242,1)), color-stop(25%,rgba(255,255,255,1)));
+	background: -webkit-linear-gradient(top,  rgba(217,229,242,1) 0%,rgba(255,255,255,1) 25%);
+	background: -o-linear-gradient(top,  rgba(217,229,242,1) 0%,rgba(255,255,255,1) 25%);
+	background: -ms-linear-gradient(top,  rgba(217,229,242,1) 0%,rgba(255,255,255,1) 25%);
+	background: linear-gradient(to bottom,  rgba(217,229,242,1) 0%,rgba(255,255,255,1) 25%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9e5f2', endColorstr='#ffffff',GradientType=0 );
+}
+#menu.opened {	
+	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
+	background: -webkit-gradient(linear, left top, right top, color-stop(75%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0)));
+	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%);
+	background: -o-linear-gradient(left,  rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%);
+	background: -ms-linear-gradient(left,  rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%);
+	background: linear-gradient(to right,  rgba(255,255,255,1) 75%,rgba(255,255,255,0) 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
 }
 
 #menu #menu_title {
 	position:relative;
+	padding:0;
+	margin:21px 0 0 0;
 	text-align:center;
-	margin:0;
-	margin-top:-4px;
-	padding:0;
 	cursor:pointer;
-}
-#menu #menu_title:hover p {
-	color:#EFAB00;
-}
-#menu #menu_title p {
-	margin:0;
-	padding:0;
 	font-size:20px;
 	line-height:20px;
 	font-weight:bold;
-	text-transform:uppercase;
-	color:#04357B;
 }
 
 #menu #menu_box {
@@ -1334,18 +1334,6 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	text-align:center;
 }
 
-#menu #menu_box a {
-	color:#04357B;
-	display:block;
-	width:100%;
-}
-
-#menu #menu_box h1 {
-	margin:-10px 0 0 -3px;
-	padding:0;
-	border-bottom:2px solid #04357B;
-}
-
 #menu #menu_box ul {
 	margin:0;
 	padding:0;
@@ -1356,18 +1344,27 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 
 #menu #menu_box ul li {
 	margin:0;
-	padding:5px 3px 5px 5px;
+	padding:5px 3px 5px 15px;
 	list-style:none;
 	cursor:pointer;
 	line-height:20px;
 	height:20px;
 	font-size:20px;
-	border-bottom:2px solid white;
+	text-transform:capitalize;
 }
 
-#menu #menu_box ul li:hover {
-	border-bottom-color:#04357B;
-	background-color:#EFAB00;
+#menu #menu_box ul li:FIRST-CHILD {
+	padding-left:5px;
+	font-weight: bold;
+}
+
+#menu #menu_box ul li a {
+	color:#04357B;
+	display:block;
+	width:100%;
+}
+#menu #menu_box ul li:hover a {
+	color:#EFAB00;
 }
 
 #menu #menu_box ul li#rss_ln a {
@@ -1434,6 +1431,25 @@ vertical-align	0%		-5%			-10%		-15%		-20%		-25%		-30%
 	margin-top:0px;
 }
 
+#welcome span.milestone {
+	margin-left:5px;
+	padding:2px 5px;
+	font-weight:bold;
+	border:1px solid #04357B;
+
+	background: #ffffff;
+	background: -moz-linear-gradient(top,  #ffffff 15%, #D9E5F2 85%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,#ffffff), color-stop(85%,#D9E5F2));
+	background: -webkit-linear-gradient(top,  #ffffff 15%,#D9E5F2 85%);
+	background: -o-linear-gradient(top,  #ffffff 15%,#D9E5F2 85%);
+	background: -ms-linear-gradient(top,  #ffffff 15%,#D9E5F2 85%);
+	background: linear-gradient(to bottom,  #ffffff 15%,#D9E5F2 85%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#D9E5F2',GradientType=0 );
+}
+#welcome span.milestone .fa {
+	margin-right:5px;
+}
+
 #welcome a {
 	text-decoration:underline;
 }
diff --git a/todo b/todo
index bf16090..aaa39b0 100644
--- a/todo
+++ b/todo
@@ -11,6 +11,8 @@ Bug fix:
 - [1.0.1] Check le document type plutot que l'extension pour les /img
 - [1.0.1] Resize .gif
 - Fix les "xxx se déconnecte" intempestives
+- code reader : mettre la scrollbar à l'intérieur du code
+- Trouver une meilleure place pour le menu
 
 New features:
 - [1.1.0] Refiltre par type dans le search 
@@ -20,7 +22,6 @@ New features:
 - [1.1.0] search : add tagname, like code:blabla to search blabla in codes only
 - [1.2.0] Delete phrases table / généraliser ? ne pas oublier la item list
 - [1.3.0] Reward on post
-- code reader : mettre la scrollbar à l'intérieur du code
 - modification code : possibilité de modifier la description d'un code après enregistrement + entre les versions
 - Add functionality to modify docs
 - compatibilité ie8+