.film_img a {
	position:relative;
}

.film_img a span {
	position: absolute;
	left: 160px;
	bottom: 25px;
	display:none;
	z-index:99;
}

.film_img a:hover span {
	display:block;
}

/*
+--------------------------+----------+-------------+
| genres                   | publics  | types       |
+--------+--------+--------+----------+-------------+
| genre1 | genre2 | genre3 | public1  | type1       |
| ...    | ...    | ...    | public2  | type2       |
| ...    | ...    | ...    | ...      | ...         |
| ...    | ...    | ...    | publicP  | typeT       |
| ...    | ...    | ...    +----------+-------------+
| ...    | ...    | ...    | statuts  | legendes    |
| ...    | ...    | ...    +----------+-------------+
| ...    | ...    | ...    | vu       | Oui         |
| ...    | ...    | ...    | sorti    | Indifférent |
| ...    | ...    | ...    |          | Non         |
+--------+--------+--------+----------+-------------+
*/

.films_filter {
	margin-top: 1px;
	background-color: white;
	color: white;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-template-rows: repeat(4, auto);
	grid-gap: 1px;
	grid-template-areas: "genres genres genres publics types"
	                     "genre1 genre2 genre3 public  type"
	                     "genre1 genre2 genre3 statuts legendes"
	                     "genre1 genre2 genre3 statut  legende"
}

.item-1 {
	grid-area: genres;
	background-color: #009688;
}

.item-2 {
	grid-area: publics;
	background-color: #009688;
}

.item-3 {
	grid-area: types;
	background-color: #009688;
}

.item-4 {
	grid-area: genre1;
	background-color: #009688;
}

.item-5 {
	grid-area: genre2;
	background-color: #009688;
}

.item-6 {
	grid-area: genre3;
	background-color: #009688;
}

.item-7 {
	grid-area: public;
	background-color: #009688;
}

.item-8 {
	grid-area: type;
	background-color: #009688;
}

.item-9 {
	grid-area: statuts;
	background-color: #009688;
}

.item-10 {
	grid-area: legendes;
	background-color: #009688;
}

.item-11 {
	grid-area: statut;
	background-color: #009688;
}

.item-12 {
	grid-area: legende;
	background-color: #009688;
}

.w3-tooltip .tooltiptext{
	display: none;
	color: white;
	background-color: #00685d;
	border: 1px solid white;
	position: absolute;
	width: 200px;
	left: 100px;
	bottom: 50px;
	padding: 5px;
	border-radius: 6px;
	z-index:99;
}

.w3-tooltip:hover .tooltiptext {
	display: block;
	opacity: 1;
}