.slider-contain
{
	margin-bottom: 45px;
}

.sombre
{
	/* il sert juste à imposer une longueur au cadre-diapo */
	opacity: 0;
}

.cadre-diapo
{
	position:relative;	
}
	
	
.diapo1
{
	opacity:0;
	position:absolute;
	left:50%;
	transform:translate3d(-50%,-50%,0);
	top:50%;
	transition:opacity 1s;
	width:100%;
}
	

 button
 {	
	border: none;
	cursor: pointer;
	outline: none;
	}
	
.precedent, .suivant{
	opacity: 0;
	color: silver;
	transition:color .4s linear, opacity .4s linear;
	transform:translatey(-50%);
	top:50%;
	padding:.5rem;
	font-size:2rem;
	background:white;
	position:absolute	
	}

.precedent{left:0}
.suivant{right:0}
	

.diapo1:hover ~ button
{
	opacity: 0.7;
}

.precedent:hover,  .suivant:hover
{
	color:black;
	opacity: 1;
}
	
.cadre-demo{
	display: flex;
	justify-content:center;
	margin-top: 30px;
}

.demo1
{
	color: white;
	border-radius: 100%;
	margin: 3px;
	padding: 0 5px;
}

.numeros
		{
	transition:background .4s linear;
	color:white;
	background:#FF3333;
}