diff --git a/fr/kosmopolit.html b/fr/kosmopolit.html
index 4e6275d..8db2093 100644
--- a/fr/kosmopolit.html
+++ b/fr/kosmopolit.html
@@ -15,7 +15,8 @@
 
 		<nav class="navbar sticky">
 
-			<label for="burger" class="burger"></label><input type="checkbox" id="burger">
+			<input type="checkbox" id="burger">
+			<label for="burger" class="burger"></label>
 			<div class="nav_left">
 				<a id="nav_logo" href="index.html"	target="_parent"><img src="./docs/nav/kosmopolit_logo_mini.png" alt="logo kosmopolit"></a>
 				<a href="./fr/kosmopolit.html"		target="_parent"><p>KOSMOPOLIT</p></a>
diff --git a/styles/media.css b/styles/media.css
index 189567e..c1ca61b 100644
--- a/styles/media.css
+++ b/styles/media.css
@@ -74,16 +74,34 @@
 		height: 2px;
 		border-top: 2px solid var(--color-grey-dark);
 	}
+	nav.navbar #burger:checked + .burger {
+		cursor: default;
+	}
 	nav.navbar #burger:checked ~ .nav_right {
 		display: flex;
 	}
 	nav.navbar #burger:checked ~ .nav_left a {
 		display: flex;
 	}
+	nav.navbar #burger:checked ~ .nav_left a:not(#nav_logo) {
+		height: 50px;
+	}
 	nav.navbar #burger:checked ~ .nav_left a#nav_logo {
 		display: flex;
 		margin-bottom: 40px;
 	}
+	nav.navbar #burger:checked + .burger::before {
+		transform: rotate(40deg);
+		top: 18px;
+		right: 21px;
+		height: 2px;
+		border-bottom: none;
+	}
+	nav.navbar #burger:checked + .burger::after {
+		transform: rotate(-40deg);
+	}
+	nav.navbar .burger:checked::after {
+	}
 	/*MAIN*/
 	main {
 		max-width: 90%;