.livreor-envoi {
display: none;
flex-direction: column;
margin-left: 2em;
width: 400px;
border: green solid 0px;
font-family: roboto;

}

.livreor-envoi textarea {
width: 400px;

height: 30px;
}


.blocsug {
margin: auto;
border: 0px red solid;
width: 95%;
border: 0px green solid;

}

.buttonONOFF{
height: 35px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,80%,1);
border-radius: 0%;
font-family: roboto-bold;
	
}

.buttonONOFF:hover{
height: 35px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,15%,1);
color: white;
border-radius: 0%;
font-family: roboto-bold;
	
}

.buttontous{
height: 35px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,80%,1);
border-radius: 0%;
font-family: roboto-bold;
	
}

.buttontous:hover{
height: 35px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,15%,1);
color: white;
border-radius: 0%;
font-family: roboto-bold;
	
}


.buttonONOFF2 {
height: 35px;
font-size: 18px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,80%,1);
border-radius: 0%;
font-family: roboto-bold;
	
}

.buttonONOFF2:hover{
border: 2px transparent solid;
background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,15%,1);
color: white;
font-family: roboto-bold;
	
}

.livre-retour{
height: 30px;
font-size: 16px;

background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,80%,1);
border-radius: 0%;
font-family: roboto-bold;	
margin-bottom: 40px;
}

.livre-retour:hover{
height: 30px;
font-size: 16px;
background-color : rgba(220,220,220,0.5);
background-color : hsla(0,0%,15%,1);
color: white;
font-family: roboto-bold;	
margin-bottom: 40px;
}


#sug-mail, #sug-ville, #sug-nom {
  resize: none;
}

#sug-story {
height: 200px;	
	
}
.livreor-envoi div {
	padding-top: 0.5em;

	
}

.livreor-envoi button {
	padding-top: 0.5em;
	width: 100px;
	text-align: center;
	margin: auto;
	
	
}

@media screen and (max-width: 550px)
{

.blocsug p {
font-size: 12px;
font-family: roboto;
	

}

	.livreor-envoi {
font-size: 12px;
margin-left: 1em;
width: 300px;
font-family: roboto;
}

	.livreor-envoi h2{

font-size: 16px;
}

#sug-mail, #sug-ville, #sug-nom {
  width: 200px;
  font-size: 12px;
}

#sug-story {
	  width: 300px;
height: 200px;	
  font-size: 12px;
	
}	
	
	
	
	
	
	
}

.nbr-msg {
padding-bottom: 20px;	
	
}

.sug-msg {
padding-bottom: 20px;
margin-left: 20px;	
margin-right: 20px;

	background-color: white;
	
	border-bottom: 2px dotted #1d5628;
}

.sug-msg p{

margin-left: 20px;
	border: 0px solid black;
}

.div-sug {
display: flex;
flex-direction: column;
border: 0px solid green;	
width: 100%;
margin: auto;	
	
}



@media screen and (max-width: 650px)
{
.nbr-msg {
padding-bottom: 20px;	
	width: 100%;

}

.sug-msg {
padding-bottom: 20px;
margin-left: 1px;	
margin-right: 1px;

	background-color: white;
	
	border-bottom: 2px dotted #1d5628;
		width: 100%;

}

.sug-msg p{

margin-left: 1px;
	border: 0px solid black;
		width: 100%;
	
}

.div-sug {
display: flex;
flex-direction: column;
border: 0px solid green;	
width: 100%;
	width: 100%;

}	
	
	
}