*{box-sizing: border-box}

	body{margin:0;}
	
.cadre-diapo{
margin: auto;
min-height:400px;
max-height:800px;
max-width:800px;
position:relative;
	}
	
.diapoA {
opacity:0;
position:absolute;
left:50%;
top:50%;transform:translate(-50%,-50%);
transition:opacity 1s;
width:100%;
max-width:600px;	
}
	
 button{
border: none;
cursor: pointer
	}
	
.precedent,
.suivant{
color: silver;
transition:color .4s linear;
top:50%;transform:translatey(-50%);
padding:.5rem;
font-size:2rem;
background:#eee;
position:absolute	
	}

.precedent{left:0}
.suivant{right:0}
	
.precedent:hover,
.suivant:hover{color:#555}
	
.numeros{
transition:background .4s linear;
color:white;
background:#7A5FFF
	}
	
.cadre-demo{
display:flex;
justify-content: center;
margin-top: 25px;	
}