Index: admin/style/scss/default.scss
===================================================================
--- admin/style/scss/default.scss	(revision 3355)
+++ admin/style/scss/default.scss	(revision 3365)
@@ -26,4 +26,9 @@
 --------------------------------------------------- */
 @import "partials/layout";
+
+/** --------------------------------------------------
+	Colors
+--------------------------------------------------- */
+@import "partials/colors";
 
 /** --------------------------------------------------
@@ -70,2 +75,3 @@
 @import "partials/classes";
 @import "partials/utils";
+@import "partials/mediaqueries";
Index: admin/style/scss/init/_config.scss
===================================================================
--- admin/style/scss/init/_config.scss	(revision 3355)
+++ admin/style/scss/init/_config.scss	(revision 3365)
@@ -4,5 +4,5 @@
 // Do not support IE less than IE9
 $browser-minimum-versions: (
-  "ie": "9"
+  "ie": "10"
 );
 $graceful-usage-threshold: 100;
@@ -31,4 +31,5 @@
 
 // Palette de base
+
 $blue: 				#137bbb;
 $green: 			#9ac123;
@@ -41,4 +42,5 @@
 
 $gray-very-dark:	shade($gray, 72%);		// #323232 (near to #333 used before)
+$gray-semi-dark:	shade($gray, 25%);		// #868686 (near to #999 used before)
 $gray-light:		tint($gray, 30%);		// #c9c9c9 (near to #ccc used before)
 $gray-very-light:	tint($gray, 85%);		// #f3f3f3 (near to #f7f7f7 used before)
@@ -46,4 +48,8 @@
 $white:				#fff;
 $black:				#000;
+
+// Couleurs secondaires
+
+
 
 // Application
@@ -62,4 +68,5 @@
 
 // Autres
+
 $css-img-path: 'img'; // utile pour le mixin de fallback svg
 
Index: admin/style/scss/init/_mixins-functions.scss
===================================================================
--- admin/style/scss/init/_mixins-functions.scss	(revision 3355)
+++ admin/style/scss/init/_mixins-functions.scss	(revision 3365)
@@ -1,45 +1,58 @@
 // mixin svg fallback
 @mixin svg(
-    $file-name,
-    $css-img-path: $css-img-path)
+	$file-name,
+	$css-img-path: $css-img-path)
 {
-    background-image: inline-image($file-name+'.png');
-    background-image: inline-image($file-name+'.svg'), none;
+	background-image: inline-image($file-name+'.png');
+	background-image: inline-image($file-name+'.svg'), none;
 }
 
 @mixin bg-with-svg(
-    $file-name,
-    $css-img-path: $css-img-path,
-    $repeat: no-repeat,
-    $position: 50% 50%,
-    $bg-color: transparent)
+	$file-name,
+	$css-img-path: $css-img-path,
+	$repeat: no-repeat,
+	$position: 50% 50%,
+	$bg-color: transparent)
 {
-    background: inline-image($file-name+'.png') $repeat, $position, $bg-color;
-    background-image: inline-image($file-name+'.svg'), none;
+	background: inline-image($file-name+'.png') $repeat, $position, $bg-color;
+	background-image: inline-image($file-name+'.svg'), none;
 }
 
+// Mix from Nico3333 (https://github.com/nico3333fr/ROCSSTI/blob/master/src/css/rocssti-fr.css#L637)
+// and ffood (http://www.ffoodd.fr/cache-cache-css/)
 @mixin visually-hidden {
-    border: 0;
-    clip: rect(0 0 0 0);
-    height: 1px;
-    margin: -1px;
-    overflow: hidden;
-    padding: 0;
-    position: absolute;
-    width: 1px;
+	border: 0;
+	clip: rect(0 0 0 0);
+	clip-path: inset(50%);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+	white-space: nowrap;
+}
+@mixin visually-hidden-focus {
+	clip: auto;
+	clip-path: none;
+	height: auto;
+	overflow: visible;
+	position: static;
+	width: auto;
+	white-space: normal;
 }
 
 // Remove any unit from a value
 @function strip-unit(
-    $value)
+	$value)
 {
-    @return $value / ($value * 0 + 1);
+	@return $value / ($value * 0 + 1);
 }
 
 // Compute absolute value (in em or rem) depending on font-size of the html element (given in %)
 @function relative-to-screen(
-    $value,             // em or rem value
-    $html-font-size)    // in %
+	$value,             // em or rem value
+	$html-font-size)    // in %
 {
-    @return $value / (strip-unit($html-font-size) / 100);
+	@return $value / (strip-unit($html-font-size) / 100);
 }
Index: admin/style/scss/init/_rebase.scss
===================================================================
--- admin/style/scss/init/_rebase.scss	(revision 3355)
+++ admin/style/scss/init/_rebase.scss	(revision 3365)
@@ -154,6 +154,11 @@
 	margin: 0;
 }
-/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
+
+/* Screen-reader only */
 .visually-hidden {
 	@include visually-hidden;
+	&:focus,
+	&:active {
+		@include visually-hidden-focus;
+	}
 }
Index: admin/style/scss/partials/_buttons.scss
===================================================================
--- admin/style/scss/partials/_buttons.scss	(revision 3355)
+++ admin/style/scss/partials/_buttons.scss	(revision 3365)
@@ -46,8 +46,7 @@
 input.button.start {
     color: #fff;
-    background-color: #25A6E1;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#25A6E1), to(#188BC0));
-    background-image: linear-gradient(#25A6E1, #188BC0);
-    border-color: #25A6E1;
+    background-color: #25a6e1;
+    @include background-image(linear-gradient(to bottom, #25a6e1, #188bc0));
+    border-color: #25a6e1;
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
 }
@@ -59,8 +58,7 @@
 a.button.submit:hover,
 a.button.submit:focus {
-    background-color: #188BC0;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#188BC0), to(#25A6E1));
-    background-image: linear-gradient(#188BC0, #25A6E1);
-    border-color: #188BC0;
+    background-color: #188bc0;
+    @include background-image(linear-gradient(to bottom, #188bc0, #25a6e1));
+    border-color: #188bc0;
 }
 
@@ -80,9 +78,8 @@
 a.button.reset {
     color: #000;
-    background-color: #EAEAEA;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#EAEAEA));
-    background-image: linear-gradient(#f9f9f9, #EAEAEA);
+    background-color: #eaeaea;
+    @include background-image(linear-gradient(to bottom, #f9f9f9, #eaeaea));
     background-repeat: repeat-x;
-    border-color: #dfdfdf #dfdfdf #C5C5C5;
+    border-color: #dfdfdf #dfdfdf #c5c5c5;
     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
 }
@@ -110,9 +107,8 @@
 a.button.reset:focus,
 a.button:focus {
-    background-color: #DADADA;
-    background-image: -webkit-gradient( linear, left top, left bottom, from(#EAEAEA), to(#DADADA));
-    background-image: linear-gradient(#EAEAEA, #DADADA);
+    background-color: #dadada;
+    @include background-image(linear-gradient(to bottom, #eaeaea, #dadada));
     background-repeat: repeat-x;
-    border-color: #CCCCCC #CCCCCC #B5B5B5;
+    border-color: #cccccc #cccccc #b5b5b5;
 }
 
@@ -132,10 +128,9 @@
 input.delete:focus,
 a.button.delete:focus {
-    color: #FFFFFF;
-    background-color: #B33630;
-    background-image: -webkit-gradient( linear, left top, left bottom, from(#DC5F59), to(#B33630));
-    background-image: linear-gradient(#DC5F59, #B33630);
+    color: #ffffff;
+    background-color: #b33630;
+    @include background-image(linear-gradient(to bottom, #dc5f59, #b33630));
     background-repeat: repeat-x;
-    border-color: #CD504A;
+    border-color: #cd504a;
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
 }
@@ -149,11 +144,10 @@
     color: #000;
     background-color: #bee74b;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#bee74b), to(#9BCA1C));
-    background-image: linear-gradient(#bee74b, #9BCA1C);
+    @include background-image(linear-gradient(to bottom, #bee74b, #9bca1c));
     border-color: #bee74b;
     padding: .33em 1.33em .5em;
     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
-    font-weight: normal;
-    font-size: 1.16em;
+//    font-weight: normal;
+//    font-size: 1.16em;
 }
 
@@ -161,8 +155,7 @@
 .button.add:active,
 .button.add:focus {
-    background-color: #9BCA1C;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#9BCA1C), to(#bee74b));
-    background-image: linear-gradient(#9BCA1C, #bee74b);
-    border-color: #9BCA1C;
+    background-color: #9bca1c;
+    @include background-image(linear-gradient(to bottom, #9bca1c, #bee74b));
+    border-color: #9bca1c;
 }
 
Index: admin/style/scss/partials/_charte.scss
===================================================================
--- admin/style/scss/partials/_charte.scss	(revision 3355)
+++ admin/style/scss/partials/_charte.scss	(revision 3365)
@@ -1,4 +1,4 @@
 .guideline #content h2 {
-    color: #D33800;
+    color: #d33800;
     padding: 2em 0 0 0;
     margin: 1em 0;
Index: admin/style/scss/partials/_classes.scss
===================================================================
--- admin/style/scss/partials/_classes.scss	(revision 3355)
+++ admin/style/scss/partials/_classes.scss	(revision 3365)
@@ -32,5 +32,5 @@
 
 .ac_over {
-    background-color: #2373A8;
+    background-color: #2373a8;
     color: white;
 }
Index: admin/style/scss/partials/_colors.scss
===================================================================
--- admin/style/scss/partials/_colors.scss	(revision 3365)
+++ admin/style/scss/partials/_colors.scss	(revision 3365)
@@ -0,0 +1,117 @@
+// Colors (text and border colors and backgrounds)
+
+body {
+	color: $primary-color;
+	background: $primary-background;
+}
+
+h2 {
+	color: $ternary-color;
+}
+h3, .as_h3 {
+	color: $secondary-color;
+}
+h4, .as_h4 {
+	color: $ternary-color;
+}
+h5 {
+	color: $ternary-color;
+}
+h6 {
+	color: $ternary-color;
+}
+
+/* ---------------------------------------------------------------- layout: main */
+
+#header {
+	color: $white;
+	background: $ternary-background;
+	border-bottom: 4px solid $light-blue;
+}
+
+#wrapper {
+	background: $secondary-background url(bg_wrapper.png) repeat-y 14em;
+}
+
+#content {
+	background: $white;
+}
+
+#main-menu {
+	background: $secondary-background;
+}
+
+#footer {
+	background-color: $white;
+	border-top: 1px solid $gray-light; // #ccc;
+}
+
+/* to hide main-menu */
+#collapser {
+	background: $light-blue; // #f3f3f3 url(../images/collapser-hide.png) no-repeat center bottom;
+}
+
+.hide-mm #collapser {
+    //	background: #e3e3e3 url(../images/collapser-show.png) no-repeat center bottom;
+}
+
+/* if main-menu is hidden */
+#wrapper.hide-mm {
+	background: $white;
+}
+
+/* ---------------------------------------------------------------- layout: popups */
+
+.popup h1 {
+	color: $white;
+	background: $ternary-background;
+}
+
+/* ------------------------------------------------------------------------------------
+															UN POIL DE MEDIA QUERIES
+------------------------------------------------------------------------------------ */
+
+@media screen and (max-width: $xl-screen) {
+	#header, h1 {
+		background: $gray-very-dark;
+	}
+	#top-info-user {
+		background: $ternary-background;
+	}
+	#top-info-user a.active {
+		color: $white;
+		background: $gray-semi-dark;
+	}
+	#wrapper {
+		background: $secondary-background url(bg_wrapper.png) repeat-y 17em;
+	}
+}
+
+@media screen and (max-width: $s-screen) {
+	#help-button {
+		background-color: $light-blue;
+	}
+}
+
+@media screen and (max-width: $xs-screen) {
+	h1 a:link {
+		border-right: 1px solid $gray-light;
+	}
+	h1 a:hover,
+	h1 a:focus {
+		border-right: 1px solid $light-blue;
+	}
+	.pseudo-tabs li {
+		border-top: 1px solid $gray-light;
+	}
+}
+
+@media screen and (max-width: $xxs-screen) {
+	h1,
+	h1 a {
+		border-right: $gray-very-dark !important;
+	}
+	.pseudo-tabs li {
+		border-top: 1px solid $gray-light !important;
+	}
+}
Index: admin/style/scss/partials/_common.scss
===================================================================
--- admin/style/scss/partials/_common.scss	(revision 3355)
+++ admin/style/scss/partials/_common.scss	(revision 3365)
@@ -1,3 +1,4 @@
 /* Typographie */
+
 // base //
 html {
@@ -32,6 +33,4 @@
 	}
 	font-family: $sans-serif;
-	color: $primary-color;
-	background: $primary-background;
 }
 #wrapper {
@@ -51,5 +50,4 @@
 	line-height: 1.25;
 	padding: 0 0 1.5em;
-	color: $ternary-color;
 }
 h3, .as_h3 {
@@ -58,10 +56,8 @@
 	line-height: 1.5;
 	margin-top: 1em;
-	color: $secondary-color;
 }
 h4, .as_h4 {
 	font-size: 1.16em;
 	line-height: 1.5;
-	color: $ternary-color;
 }
 h5 {
@@ -69,10 +65,8 @@
 	line-height: 1.5;
 	font-weight: bold;
-	color: $ternary-color;
 }
 h6 {
 	font-size: 1em;
 	line-height: 1.5;
-	color: $ternary-color;
 }
 
Index: admin/style/scss/partials/_header.scss
===================================================================
--- admin/style/scss/partials/_header.scss	(revision 3355)
+++ admin/style/scss/partials/_header.scss	(revision 3365)
@@ -2,141 +2,161 @@
 
 #prelude {
-    line-height: 1.5;
-    margin: 0;
-    padding: 0;
-    overflow: hidden;
-    position: absolute;
-    top: 3em;
-    left: 0;
-    background: #A2CBE9;
-    width: 100%;
-    z-index: 100;
+	line-height: 1.5;
+	margin: 0;
+	padding: 0;
+	overflow: hidden;
+	position: absolute;
+	top: 3em;
+	left: 0;
+	background: $light-blue;
+	width: 100%;
+	z-index: 100;
+	li {
+		list-style-type: none;
+		margin: 0;
+		background: transparent;
+		display: inline;
+		a {
+			padding: 3px 16px 3px 8px;
+			background: $light-blue;
+			color: $black;
+			text-decoration: underline;
+			&:hover, &:focus {
+				background: $white;
+			}
+		}
+	}
 }
-
-#prelude li {
-    list-style-type: none;
-    margin: 0;
-    background: transparent;
-    display: inline;
-}
-
-#prelude li a {
-    padding: 3px 16px 3px 8px;
-    background: #A2CBE9;
-    color: #000;
-    text-decoration: underline;
-}
-
-#prelude li a:hover,
-#prelude li a:focus {
-    background: #FFF;
-}
-
 
 /* si le prélude est affiché on repousse les trucs dessous */
 
 #wrapper.with-prelude {
-    padding-top: 1em;
+	padding-top: 1em;
 }
 
 #help-button.with-prelude,
 #collapser.with-prelude {
-    top: 1em;
+	top: 1em;
 }
-
 
 /* header global h1, form#top-info-blog, ul#top-info-user */
 
 #header a {
-    color: #FFF;
+	color: $white;
 }
 
 #header img {
-    vertical-align: middle;
-    padding-left: .5em;
+	vertical-align: middle;
+	padding-left: .5em;
 }
-
 
 /* h1 */
 
 h1 {
-    text-indent: 100%;
-    width: 16.5em;
+	text-indent: 100%;
+	width: 16.5em;
+	a {
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 150px;
+		height: 3em;
+		color: $white;
+		background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 6px;
+		transition: none;
+		&:hover,
+		&:focus {
+			background-position: 0 -94px;
+			background-color: transparent;
+			transition: none;
+		}
+		&:link {
+			transition-timing-function: ease-in-out;
+		}
+	}
 }
-
-h1 a {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 150px;
-    height: 3em;
-    color: #fff;
-    background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 6px;
-    transition: none;
-}
-
-h1 a:hover,
-h1 a:focus {
-    background-position: 0 -94px;
-    background-color: transparent;
-    transition: none;
-}
-
-h1 a:link {
-    transition-timing-function: ease-in-out;
-}
-
 
 /* top-info-blog */
 
 #top-info-blog select {
-    max-width: 20em;
+	max-width: 20em;
 }
 
 #top-info-blog a {
-    margin-left: 1.5em;
+	margin-left: 1.5em;
 }
 
 #top-info-blog input[type=submit] {
-    background: #000;
-    border-color: #999;
-    margin-left: .33em;
+	background: $black;
+	border-color: $gray-semi-dark;
+	margin-left: .33em;
 }
 
 #top-info-blog input[type=submit]:hover {
-    background: #999;
+	background: $gray-semi-dark;
 }
 
 #top-info-blog p {
-    display: inline-block;
-    margin: 0;
+	display: inline-block;
+	margin: 0;
 }
-
 
 /* top-info-user */
 
 #top-info-user {
-    padding-right: 18px;
-    list-style-type: none;
-    text-align: right;
+	padding-right: 18px;
+	list-style-type: none;
+	text-align: right;
 }
 
 #top-info-user li {
-    display: inline-block;
-    margin-left: .5em;
-    padding-left: .5em;
-    border-left: 1px solid #999;
+	display: inline-block;
+	margin-left: .5em;
+	padding-left: .5em;
+	border-left: 1px solid $gray-semi-dark;
 }
 
 #top-info-user li:first-child {
-    border-left: none;
+	border-left: none;
 }
 
 #top-info-user a.active {
-    border-bottom-color: #fff;
-    margin: 0;
-    padding: 18px .5em;
-    background-color: #fff;
-    color: #333;
-    font-weight: bold;
+	border-bottom-color: $white;
+	margin: 0;
+	padding: 18px .5em;
+	background-color: $white;
+	color: $primary-color;
+	font-weight: bold;
 }
+
+/* ------------------------------------------------------------------------------------
+                                                            UN POIL DE MEDIA QUERIES
+------------------------------------------------------------------------------------ */
+
+@media screen and (max-width: $xl-screen) {
+	#top-info-user {
+		padding-right: .5em;
+	}
+	#top-info-user a.active {
+		padding: 2px 8px;
+		border-width: 0;
+		border-radius: 6px;
+	}
+}
+
+@media screen and (max-width: $xxs-screen) {
+	h1,
+	h1 a {
+		padding: 0;
+	}
+}
+
+@media screen and (max-width: $xs-screen) {
+	h1 a:link {
+		background: transparent url(dc_logos/b-dotclear120.png) no-repeat -270px 6px;
+	}
+	h1 a:hover,
+	h1 a:focus {
+		background: url(dc_logos/b-dotclear120.png) no-repeat -270px -94px;
+	}
+}
Index: admin/style/scss/partials/_layout.scss
===================================================================
--- admin/style/scss/partials/_layout.scss	(revision 3355)
+++ admin/style/scss/partials/_layout.scss	(revision 3365)
@@ -1,2 +1,3 @@
+// Admin layout
 #dotclear-admin {
     display: flex;
@@ -6,9 +7,5 @@
 
 #header {
-    background: $ternary-background;
-    color: $white;
-    border-bottom: 4px solid $light-blue;
-    width: 99.99%;
-    /* Bugfix Chrome >= 49.0.2623.108 */
+    width: 99.99%; /* Bugfix Chrome >= 49.0.2623.108 */
     display: table;
     position: relative;
@@ -31,5 +28,4 @@
     width: 100%;
     z-index: 10;
-    background: $secondary-background url(bg_wrapper.png) repeat-y 14em;
     flex: 1;
 }
@@ -49,5 +45,4 @@
     margin: 0 0 0 14em;
     padding: .5em 1.5em .75em 2.5em;
-    background: $white;
 }
 
@@ -59,5 +54,4 @@
     padding-bottom: 1em;
     overflow: hidden;
-    background: $secondary-background;
 }
 
@@ -67,6 +61,4 @@
     padding: .5em 0 .5em 1em;
     text-align: left;
-    border-top: 1px solid $gray-light; // #ccc;
-    background-color: $white;
 }
 
@@ -82,5 +74,4 @@
     overflow: hidden;
     display: block;
-    background: $light-blue; // #f3f3f3 url(../images/collapser-hide.png) no-repeat center bottom;
     border-right: 0; // 1px solid #999;
     border-bottom: 0;
@@ -93,10 +84,5 @@
 }
 
-
 /* if main-menu is hidden */
-
-#wrapper.hide-mm {
-    background: $white;
-}
 
 .hide-mm #main {
@@ -118,5 +104,4 @@
 .hide-mm #collapser {
     left: 0;
-    //	background: #e3e3e3 url(../images/collapser-show.png) no-repeat center bottom;
 }
 
@@ -128,5 +113,4 @@
     display: block;
 }
-
 
 /* -------------------------------------------------------------- layout: two-cols */
@@ -227,10 +211,8 @@
     width: 100%;
     margin: 0;
-    background: $ternary-background;
     font-size: 1.5em;
     text-indent: 1em;
     line-height: 1.5em;
     font-weight: normal;
-    color: $white;
 }
 
@@ -307,5 +289,4 @@
     clear: both;
 }
-
 
 /*
@@ -346,13 +327,9 @@
 }
 
-
 /* ------------------------------------------------------------------------------------
-															UN POIL DE MEDIA QUERIES
+                                                            UN POIL DE MEDIA QUERIES
 ------------------------------------------------------------------------------------ */
 
-@media screen and (min-width: $xl-screen) {
-    #wrapper {
-        background: $secondary-background url(bg_wrapper.png) repeat-y 17em;
-    }
+@media screen and (max-width: $xl-screen) {
     #main {
         margin-left: -17em;
@@ -370,7 +347,4 @@
         width: 19.5em;
     }
-}
-
-@media screen and (max-width: $l-screen) {
     #top-info-blog #switchblog {
         max-width: 16em;
@@ -383,10 +357,8 @@
         width: 100%;
         text-align: right;
-        background: $gray-very-dark;
     }
     #header h1,
     #header h1 a {
         width: 120px;
-        padding: 0;
         margin: 0;
     }
@@ -400,16 +372,4 @@
         display: block;
         width: 100%;
-        background: $ternary-background;
-        padding-right: 0;
-    }
-    #top-info-user li:last-child {
-        padding-right: 1em;
-    }
-    #top-info-user a.active {
-        padding: 2px 8px;
-        background: #999;
-        color: #FFF;
-        border-width: 0;
-        border-radius: 6px;
     }
     .three-boxes,
@@ -439,9 +399,5 @@
         height: 26px;
         width: 26px;
-        background-color: $light-blue;
-        padding: 0;
         margin: 0;
-        font-size: .83em;
-        line-height: 68px;
         overflow: hidden;
     }
@@ -478,13 +434,4 @@
         height: 42px;
     }
-    h1 a:link {
-        background: transparent url(dc_logos/b-dotclear120.png) no-repeat -270px 6px;
-        border-right: 1px solid $gray-light;
-    }
-    h1 a:hover,
-    h1 a:focus {
-        background: url(dc_logos/b-dotclear120.png) no-repeat -270px -94px;
-        border-right: 1px solid $light-blue;
-    }
     #wrapper,
     #main,
@@ -495,7 +442,4 @@
         margin: 0;
     }
-    #dashboard-main {
-        padding: 0;
-    }
     #main-menu a {
         display: block;
@@ -508,5 +452,4 @@
     .hide-mm #content {
         margin: 0;
-        padding: 0 .5em !important;
     }
     #collapser {
@@ -515,5 +458,4 @@
     #main #content > h2 {
         margin: 0 -.25em 1em;
-        padding: 6px 30px 4px .5em;
     }
     #dashboard-boxes .box.medium,
@@ -529,6 +471,4 @@
     #filters-form .cell {
         display: inline-block;
-        border: none;
-        padding: 1em;
         vertical-align: bottom;
     }
@@ -537,19 +477,8 @@
         float: left;
         width: 50%;
-        border-top: 1px solid #ddd;
-        padding: .25em;
-    }
-    .pseudo-tabs li:first-child,
-    .pseudo-tabs li:nth-of-type(2) {
-        border-top: none;
     }
 }
 
 @media screen and (max-width: $xxs-screen) {
-    h1,
-    h1 a {
-        padding: 0;
-        border-right: $gray-very-dark !important;
-    }
     #top-info-blog label,
     .nomobile {
@@ -569,16 +498,10 @@
     #content.with-help #help {
         width: 28rem;
-        font-size: 1.2rem // 12px;
     }
     p.top-add {
         margin-bottom: .5em;
-        text-align: center;
-    }
-    .multi-part {
-        padding-left: 0;
     }
     .part-tabs ul {
         margin: 1em 0;
-        padding: 0 .5em;
     }
     .part-tabs li a {
@@ -588,5 +511,4 @@
     #icons p {
         width: 9em;
-        padding: 1em .25em;
     }
     .media-item {
@@ -601,5 +523,4 @@
     .box.current-theme {
         margin: 5px;
-        padding: 10px;
         width: 100%;
     }
@@ -612,16 +533,8 @@
         min-width: 14em;
     }
-    th,
-    td {
-        padding: 0.3em 1em 0.3em 0;
-    }
     .pseudo-tabs li {
         display: block;
         width: 100%;
         float: none;
-        border-top: 1px solid #ddd !important;
-    }
-    .pseudo-tabs li:first-child {
-        border-top: none;
-    }
-}
+    }
+}
Index: admin/style/scss/partials/_mediaqueries.scss
===================================================================
--- admin/style/scss/partials/_mediaqueries.scss	(revision 3365)
+++ admin/style/scss/partials/_mediaqueries.scss	(revision 3365)
@@ -0,0 +1,64 @@
+/* ------------------------------------------------------------------------------------
+															UN POIL DE MEDIA QUERIES
+------------------------------------------------------------------------------------ */
+
+@media screen and (max-width: $s-screen) {
+	#help-button {
+		padding: 0;
+		font-size: .83em;
+		line-height: 68px;
+	}
+}
+
+@media screen and (max-width: $xs-screen) {
+	#dashboard-main {
+		padding: 0;
+	}
+	#content,
+	.hide-mm #content {
+		padding: 0 .5em !important;
+	}
+	#main #content > h2 {
+		padding: 6px 30px 4px .5em;
+	}
+	.cell,
+	#filters-form .cell {
+		border: none;
+		padding: 1em;
+	}
+	.pseudo-tabs li {
+		padding: .25em;
+	}
+	.pseudo-tabs li:first-child,
+	.pseudo-tabs li:nth-of-type(2) {
+		border-top: none;
+	}
+}
+
+@media screen and (max-width: $xxs-screen) {
+	#content.with-help #help {
+		font-size: 1.2rem // 12px;
+	}
+	p.top-add {
+		text-align: center;
+	}
+	.multi-part {
+		padding-left: 0;
+	}
+	.part-tabs ul {
+		padding: 0 .5em;
+	}
+	#icons p {
+		padding: 1em .25em;
+	}
+	.box.current-theme {
+		padding: 10px;
+	}
+	th,
+	td {
+		padding: 0.3em 1em 0.3em 0;
+	}
+	.pseudo-tabs li:first-child {
+		border-top: none;
+	}
+}
Index: admin/style/scss/partials/_plugins.scss
===================================================================
--- admin/style/scss/partials/_plugins.scss	(revision 3355)
+++ admin/style/scss/partials/_plugins.scss	(revision 3365)
@@ -50,5 +50,5 @@
 .modules tr.expand td:first-child {
     font-weight: bold;
-    background: #DFE5E7;
+    background: #dfe5e7;
 }
 
Index: admin/style/scss/partials/_tables.scss
===================================================================
--- admin/style/scss/partials/_tables.scss	(revision 3355)
+++ admin/style/scss/partials/_tables.scss	(revision 3365)
@@ -37,5 +37,5 @@
 
 tr.line input[type=text] {
-    background: #FFF;
+    background: #fff;
 }
 
