diff --git a/views/blocks/d.head.html b/views/blocks/d.head.html
index a148285..268eff9 100755
--- a/views/blocks/d.head.html
+++ b/views/blocks/d.head.html
@@ -1,6 +1,6 @@
 	<head>
 		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, height=device-height">
+		<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
 		<link rel="shortcut icon" href="<?=$config['views_url']?>img/favicon.png">
 <?	if (isset($head['css'])) { 
 		foreach(explode(";",$head['css']) as $css) { ?>
diff --git a/views/blocks/d.nav.html b/views/blocks/d.nav.html
index 62c7e7c..fe99bc1 100755
--- a/views/blocks/d.nav.html
+++ b/views/blocks/d.nav.html
@@ -4,7 +4,8 @@
 					<img alt="Kabano logo" src="<?=$config['views_url'].'img/'?>header.svg">
 				</a>
 				<nav>
-					<ul>
+					<input type="checkbox" id="togglemenu"><label for="togglemenu" class="hamburger on-bar"><i class="icon fas fa-bars"></i></label>
+					<ul id="menu">
  						<li class="on-bar has-sub with-subtitle"><a class="on-bar" href="#">Restauration<br>
  							<span class="subtitle">de refuges pastoraux</span></a>
  							<ul>
@@ -22,7 +23,7 @@
 								<li><a href="<?=$config['rel_root_folder']?>community">Contribuer</a></li>
 							</ul>
 						</li>
-						<li class="on-bar has-sub">
+						<li class="on-bar has-sub menu-icon">
 							<? if ($user->id == 0) { ?>
 							<a class="on-bar" href="#"><i class="icon fas fa-user"></i></a>
 							<? } elseif ($user->is_avatar_present == 't') { ?>
@@ -50,7 +51,7 @@
 								<? } ?>
 							</ul>
 						</li>
-						<li class="on-bar has-sub"><a class="on-bar" href="#"><i class="icon fas fa-question"></i></a>
+						<li class="on-bar has-sub menu-icon"><a class="on-bar" href="#"><i class="icon fas fa-question"></i></a>
 							<ul>
 								<!--<li><a href="<?=$config['rel_root_folder']?>wiki/help">Aide</a></li>-->
 								<li><a href="<?=$config['rel_root_folder']?>blog">Blog</a></li>
diff --git a/views/css/d.index.css b/views/css/d.index.css
index 07881de..60ae87c 100755
--- a/views/css/d.index.css
+++ b/views/css/d.index.css
@@ -101,7 +101,7 @@ header {
 	z-index: 1000;
 }
 
-header ul {
+#menu {
 	float: right;
 	position: relative;
 }
@@ -112,7 +112,7 @@ header li {
 	vertical-align: middle;
 }
 
-header li a {
+header li a, .hamburger {
 	color: white;
 	padding: 25px 15px 15px;
 	height: 20px;
@@ -157,7 +157,9 @@ header .icon.avatar {
 header li.has-sub:hover a, header li.has-sub:focus-within a {
 	border-bottom: 6px solid #212121;
 }
-
+header li.has-sub:hover > a {
+	cursor: default;
+}
 header li.has-sub:hover > ul, header li.has-sub:focus-within > ul {
 	display: block;
 }
@@ -229,8 +231,47 @@ header input:hover, header input:focus-within {
 	color: #222;
 }
 
+.hamburger {
+	display: none;
+	float: right;
+}
+#togglemenu {
+	display: none;
+}
+
+@media (max-width: 800px) {
+	#menu {
+		display: none;
+		background: #212121;
+		float: inherit;
+		position: inherit;
+	}
+	.hamburger {
+		display: block;
+	}
+	#togglemenu:checked ~ #menu {
+		display: block;
+	}
+	header li {
+		width: 100%;
+	}
+	header li.menu-icon {
+		width: unset;
+	}
+	header li .subtitle {
+		padding-left: 0px;
+	}
+	header li.has-sub ul {
+		width: 100%;
+	}
+	header li.has-sub:hover ul, header li.has-sub:focus-within ul, header li.has-sub:hover ul li, header li.has-sub:focus-within ul li, header li.has-sub:hover ul a, header li.has-sub:focus-within ul a {
+		background-color: #555;
+		border: 0;	
+	}
+}
+
 #Hcontent {
-	width: 850px;
+	max-width: 850px;
 	margin: 0 auto;
 }
 
@@ -255,7 +296,7 @@ section {
 	position: relative;
 	background: white;
 	margin: auto;
-	width: 820px;
+	max-width: 820px;
 	min-height: calc(100% - 94px);
 	z-index: 10;
 	padding: 15px;
@@ -293,7 +334,7 @@ section p {
 
 footer {
 	background: #212121;
-	width: 820px;
+	max-width: 820px;
 	padding: 15px;
 	margin: 15px auto 0 auto;
 	color: #c1c1c1;
@@ -331,7 +372,7 @@ footer a:hover {
 
 #AScontent {
 	height: 320px;
-	width: 850px;
+	max-width: 850px;
 	margin: auto;
 	position: relative;
 }
diff --git a/views/js/d.header.js b/views/js/d.header.js
index 904b5cd..3d7b367 100755
--- a/views/js/d.header.js
+++ b/views/js/d.header.js
@@ -72,11 +72,11 @@ function enlarge() {
 
 $(window).scroll(function() {
 	var position = $(window).scrollTop();
-	if (position>80 && small!=1) {
+	if (position>80 && small!=1 && $('body').width() > 800) {
 		small = 1;
 		reduce();
 	}
-	else if (position<=80 && small!=0) {
+	else if (position<=80 && small!=0 && $('body').width() > 800) {
 		small = 0;
 		enlarge();
 	}
