diff --git a/css/reset.css b/css/reset.css
index c7db331e846def15ac62ff9c1825cdeb2a258bbb..3bdbbba47c47172de5a6ef7d2d1cba186942c477 100644
--- a/css/reset.css
+++ b/css/reset.css
@@ -4,10 +4,10 @@
 * {
 	margin: 0;
 	padding: 0;
-	
+
 	-webkit-font-smoothing: antialiased;
-	
-	/* Don't count padding and borders towards widths */ 
+
+	/* Don't count padding and borders towards widths */
 	-webkit-box-sizing: border-box;
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
@@ -61,7 +61,7 @@ p {
 pre {
 	padding: 15px 20px;
 	margin-bottom: 20px;
-	
+
 	border-radius: 5px;
 	white-space: pre-wrap;
 }
@@ -85,7 +85,7 @@ a {
 	min-width: 280px;
 	max-width: 750px;
 	width: 60%;
-	
+
 	margin: 0 auto;
 }
 
@@ -101,7 +101,7 @@ a, .items h1 a:hover {
 	a:hover {
 		color: #1e924d;
 	}
-	
+
 pre, .hilite, mark {
 	background: #f9f6ea;
 	color: #8b657c;
@@ -117,14 +117,14 @@ input, textarea {
 	:-moz-placeholder {
 		color: #b2c5b9;
 	}
-	
+
 .error, .success {
 	padding: 20px 30px;
 	margin-bottom: 30px;
 
 	background: #e25d47;
 	color: #fff;
-	
+
 	border-radius: 5px;
 }
 	.success {
@@ -184,19 +184,20 @@ footer#bottom{
 }
 
 .half-right{
-    float: right;
-    text-align: right;
-    width: 48%;
+
+
+
 }
 
 .half-left{
-    float: left;
-    text-align: left;
-    width: 48%
+
+    width: 100%;
 }
 
 .navigation{
     margin-bottom: 1%;
+	background-color: #ffffff!important;
+	border-color: #ffffff!important;
 }
 /*collapse*/
 .collapse > a{
@@ -210,5 +211,5 @@ footer#bottom{
     display: none;
 }
 .collapse:focus div{
-    display: block; 
+    display: block;
 }
diff --git a/css/style.css b/css/style.css
index 8ae3a8598c83ba4a5f2275c8ef0ccb91f6de1942..220d49fff0e406dee6f67587e3ec279310815804 100644
--- a/css/style.css
+++ b/css/style.css
@@ -218,7 +218,7 @@ h2{
 	color: #98b1a2;
 	font-size: 14px;
 	font-style: italic;
-	
+
 	white-space: nowrap;
 }
 	.footnote {
@@ -326,7 +326,7 @@ ul.commentlist {
 	border-top: 1px solid rgba(22,54,36,.1);
 }
 	#bottom ul {
-		float: right;
+
 		list-style: none;
 	}
 		#bottom li {
@@ -338,3 +338,11 @@ ul.commentlist {
 		#bottom a {
 			text-decoration: none;
 		}
+		.barre-reseau{
+			padding-bottom: 35px;
+			margin-bottom: 10px;
+			text-align: center;
+		}
+		#barre2{
+			padding-top: 25px;
+		}
diff --git a/footer.php b/footer.php
index d46b65fb8fcf043ad4e10e4540d877e4321c151f..ebfa1c4e6d4a60982480e8713e9c7e9bc94ac174 100644
--- a/footer.php
+++ b/footer.php
@@ -1,23 +1,32 @@
+
+
         <div class="main-wrap">
                 <footer id="bottom">
-                    <div class="half-left">
-                        <?php echo html_meta('contact'); ?>
-                        <?php echo html_meta('site_licence'); ?>
-                        <?php echo html_meta('legal_informations'); ?>
-                    </div>
-                    <div class="half-right">
+                        <div class="row barre-reseau">
+                    <div class="half-right ">
                         <?php social_list("class=navigation")?>
                 </div>
-                <div class="half-right">
-                <ul class="navigation">
+                <div class="half-right col-md-12" id="barre2">
+                <ul class="navigation ">
                         <li><a href="<?php echo base_url(); ?>" title="Retour &agrave; l'accueil.">Accueil</a></li>
                         <li><a href="<?php echo base_url('admin'); ?>" title="Administration">Administration</a></li>
                         <li><a href="<?php echo rss_url(); ?>"><?php echo social_logo('rss'); ?> RSS</a></li>
                 </ul>
                     </div>
+                </div>
+                    <div class="row">
+                        <div class="col-md-12">
+                    <div class="half-left">
+                        <?php echo html_meta('contact'); ?>
+                        <?php echo html_meta('site_licence'); ?>
+                        <?php echo html_meta('legal_informations'); ?>
+                    </div>
+                </div>
+
                     <div class="half-right">
                         <?php echo html_meta('w3c'); ?>
                     </div>
+                </div>
                 </footer>
             </div>
         </div>
diff --git a/header.php b/header.php
index 75ac044540c09857d559909ea29ebc69287c3165..f9668aad0e4d0b0e6410808e4536e043df01d7cc 100644
--- a/header.php
+++ b/header.php
@@ -5,7 +5,7 @@
 		<title><?php echo page_title('Page non trouv&eacute;'); ?> - <?php echo site_name(); ?></title>
 
 		<meta name="description" content="<?php echo site_description(); ?>">
-
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
 		<link rel="stylesheet" href="<?php echo theme_url('/css/reset.css'); ?>">
 		<link rel="stylesheet" href="<?php echo theme_url('/css/style.css'); ?>">
 		<link rel="stylesheet" href="<?php echo theme_url('/css/small.css'); ?>" media="(max-width: 400px)">
@@ -20,6 +20,7 @@
 		<script>var base = '<?php echo theme_url(); ?>';</script>
 		<script src="<?php echo asset_url('/js/zepto.js'); ?>"></script>
 		<script src="<?php echo theme_url('/js/main.js'); ?>"></script>
+		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
 
 	    <meta name="viewport" content="width=device-width">
 	    <meta name="generator" content="Anchor CMS">
@@ -68,23 +69,40 @@
 			</div>
 
 			<header id="top">
-                <a id="logo" Href="<?php echo base_url(); ?>"><img style="height:150px" src="<?php echo theme_url('img/logo.svg'); ?>" alt="<?php echo site_name(); ?>"><?php echo site_description(); ?></a>
-
 
-				<nav id="main" class="navigation">
-					<ul>
-						<?php if(has_menu_items()):
-							while(menu_items()): ?>
-						<li <?php echo (menu_active() ? 'class="active"' : ''); ?>>
-							<a href="<?php echo menu_url(); ?>" title="<?php echo menu_title(); ?>">
-								<?php echo menu_name(); ?>
-							</a>
-						</li>
-						<?php endwhile;
-							endif; ?>
-						<li class="tray">
-							<a href="#tray" class="linky"><img src="<?php echo theme_url('img/categories.png'); ?>" alt="Categories" title="Articles par cat&eacute;gories"></a>
-						</li>
-					</ul>
+				<nav class="navbar navbar-default navigation col-md-12" id="main"  >
+				  <div class="container-fluid">
+				    <!-- Brand and toggle get grouped for better mobile display -->
+				    <div class="navbar-header">
+				      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
+				        <span class="sr-only">Toggle navigation</span>
+				        <span class="icon-bar"></span>
+				        <span class="icon-bar"></span>
+				        <span class="icon-bar"></span>
+				      </button>
+				      <a id="logo" Href="<?php echo base_url(); ?>"><img style="height:150px" src="<?php echo theme_url('img/logo.svg'); ?>" alt="<?php echo site_name(); ?>"><?php echo site_description(); ?></a>
+				    </div>
+					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+				      <ul class="nav navbar-nav">
+						  <ul>
+  	   						<?php if(has_menu_items()):
+  	   							while(menu_items()): ?>
+  	   						<li <?php echo (menu_active() ? 'class="active"' : ''); ?>>
+  	   							<a href="<?php echo menu_url(); ?>" title="<?php echo menu_title(); ?>">
+  	   								<?php echo menu_name(); ?>
+  	   							</a>
+  	   						</li>
+  	   						<?php endwhile;
+  	   							endif; ?>
+  	   						<li class="tray">
+  	   							<a href="#tray" class="linky"><img src="<?php echo theme_url('img/categories.png'); ?>" alt="Categories" title="Articles par cat&eacute;gories"></a>
+  	   						</li>
+  	   					</ul>
+				          </ul>			      
+				    </div><!-- /.navbar-collapse -->
+				  </div><!-- /.container-fluid -->
 				</nav>
+
+
+
 			</header>