bugfix opacity menu, new version of readme

README.md

 l3m website
 ====
-
-C'est la 5ème refonte.
+## 5ème refonte
+Oui je refais tout de zéro de temps en temps.
+## Des liens ?
+[Instance de test dispo sur internet](https://l3m.244466666.xyz/) (et hébergée sur mon ptit serveur).
+C'est tout.
+## Des screenshots ?
+Nan.
+## Des vidéos alors ?
+[D'accord](http://l3m.in/p/up/files/1551814031-l3m-demo.webm), mais juste une.
\ No newline at end of file

css/design.css

@@ -263,7 +263,6 @@ form .small{
 
 #paging{
 	width: 80%;
-	opacity: 0.8;
 	display: flex;
 	max-width: 400px;
 	font-size: 1.5em;
@@ -284,8 +283,8 @@ form .small{
 
 #paging a{
 	text-decoration: none;
-	background-color: #f0f0f0;
-	border-bottom: 0px solid #ccc;
+	background-color: rgba(240, 240, 240, 0.8);
+	border-bottom: 0px solid rgba(12, 12, 12, 0.4);
 	transition: border-bottom 0.1s, padding-bottom 0.1s;
 }
 
@@ -296,7 +295,7 @@ form .small{
 }
 
 #paging em{
-	opacity: 0.6;
+	color: rgba(12, 12, 12, 0.5);
 }
 
 #paging .current{
@@ -374,8 +373,6 @@ Media Queries
 		width: 45px;
 		height: 45px;
 	}
-
-
 	#header{
 		margin-top: 30px;
 	}
@@ -386,6 +383,7 @@ Media Queries
 		position: absolute;
 		left: -9999px;
 	}
+
 	.nav-label{
 		position: fixed;
 		top: 0;
@@ -420,13 +418,22 @@ Media Queries
 		padding: 0;
 		transition: max-height 0.3s ease, opacity 0.3s, padding 0.3s;
 	}
+	#listMenu a:hover{
+		padding: 0;
+		border-bottom: 0;
+	}
 
 	#listMenu .selected{
-		border: none;
+		border-bottom: 0px solid black;
 		max-height: 300px;
 		padding: 0;
 		opacity: 0.5;
 	}
+
+	#listMenu .selected:hover{
+		border-bottom: 0px solid black;
+		padding: 0;
+	}
 	
 	#toggle:checked ~ #listMenu{
 		border-bottom: 5px solid #ccc;

site/layout/layout.php

@@ -18,9 +18,11 @@
 			background-color: #e3e3e3;
 			padding: 7px;
 		}
-		#listMenu .selected{
-			padding-bottom: 2px;
-			border-bottom: 5px solid #ccc;
+		@media all and (min-width: 500px){
+			#listMenu .selected{
+				padding-bottom: 2px;
+				border-bottom: 5px solid #ccc;
+			}
 		}
 	</style>
 </head>