Simplify title & panels mecanism

style/_mobile.scss

@@ -1,25 +1,44 @@
 @media only screen and (max-width: 800px) {
 
-	$panel-width: "100% - 44px - 2 * #{$block-spacing}";
+	$panel-width: "100vw - #{$button-width} - 2 * #{$block-spacing}";
 
 	.desktop {
 		display: none;
 	}
 
 	#projects {
-				
+
+		.leaflet-right, .leaflet-left {
+			transition: none;
+		}
+
 		&.with-feed, &.with-settings {
 			#submap {
 				width: 100%;
 			}
-		
-			.leaflet-right, .leaflet-left {
-				width: calc(#{$panel-width});
+
+			.leaflet-right {
+				right: calc(#{$panel-width});
+			}
+			.leaflet-left {
+				left: calc(#{$panel-width});
 			}
 		
 			.leaflet-control-container .leaflet-bottom.leaflet-right {
 				display: none;
 			}
+
+			#title {
+				display: none;
+			}
+		}
+
+		&.with-feed #settings-button {
+			display:none;
+		}
+
+		&.with-settings #feed-button {
+			display:none;
 		}
 	
 		.leaflet-control-container {
@@ -31,19 +50,22 @@
 	
 		#feed, #settings {
 			width: calc(#{$panel-width});
+			max-width: calc(#{$panel-width});
+			transition: none;
 		}
 
 		#feed {
 			right: calc((#{$panel-width}) * -1);
 		}
 
-		#title {
-			width: calc(#{$panel-width} - 44px - 2 * #{$block-spacing});
-		}
-
 		#settings {
 			left: calc((#{$panel-width}) * -1);
 		}
+
+		#title {
+			width: calc(#{$panel-width} - #{$button-width} - 4 * #{$block-spacing});
+			text-align: center;
+		}
 	}
 }