.menudroite {
	display: flex;
	flex-direction: column;
}

.menudroite ul {
	display: flex;
	flex-direction: column;
	list-style: none;

	margin-top: 0;
	margin-bottom: 40px;
	max-width: 250px;
}

.menudroite span {
	display: inline-block;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	background-color: #80CC28;
	color: #fff;

	border-radius: 15px 15px 0 0;
	padding: 8px 8px;
}

.menudroite ul > li {
	background-color: #80CC28;
	margin-top: 2px;

	transition: background-position .5s;
	background-image: linear-gradient(to right, #80CC2800 50%, #333 50%);
	background-size: 200% 100%;
	background-position: right bottom;

	white-space: nowrap;
}

.menudroite ul > li > a {
	display: flex;
	transition: color .5s;
	font-family: "Roboto-Regular", Arial;
	color: #fff;

	padding: 8px 0;
	padding-left: 16px;
	padding-right: 32px;
}

.menudroite ul > li:hover {
	background-position: left bottom;
}

.menudroite ul > li:hover > a {
	text-decoration: none;
	color: #333;
}

.partiegauche {
	width: 100%;
}