:root {
	--violet: #662483;
	--violetFonce: #490c64;
  	--orange: #ec6408;
  	--tuquoise: #6ebac4;
  	--blanc: #ffffff;
  	--default: #000000;
}

.slide-menu {
	width: 60%;
	background-color: var(--violet);
}
.slide-menu, .slide-menu a { 
	color: #fff;
}

.slide-menu a { 
	margin-left: 1.5rem;
	margin-right: 1.5rem;
	padding-top:  .9rem; 
	padding-bottom:  .9rem; 
	border-bottom: 1px dotted var(--blanc); 
	text-decoration: none;
}
.slide-menu a:hover {
	background-color: var(--violetFonce);
}

.slide-menu li.active > a{
	color: var(--orange);
}

.slide-menu .controls {
	display: flex;
	margin-bottom: 1rem;
}
.slide-menu .btn {
	cursor: pointer;
	padding: .75rem 1.5rem;
	flex: 1 0 auto;
	font-size: 90%;
	color: #fff;
	background-color: var(--violetFonce);
	text-transform: uppercase;
	border:0px;
}
.slide-menu .btn:first-of-type { 
	text-align: left;
}
.slide-menu .btn:first-of-type:before {
	content: "<";
	margin-right: .5rem;
}
.slide-menu .btn:last-of-type {
	text-align: right;
}
.slide-menu .btn:last-of-type:before {
	content: "✕";
	margin-right: .5rem;
}
.slide-menu .slide-menu__backlink {
	text-transform: uppercase;
}