form, legend, ol, li {
  margin: 0;
  padding: 0;
}

.order{
 color:#363636;
 text-align: left;
 
}

h3.order{
color:#561010;
text-align: center;
 
 
}

form#identification {
  background: #E2E2E2;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
}

form#identification legend {
  color: #384313;
  font-size: 16px;
  font-weight: bold;
  padding-bottom: 10px;
  text-shadow: 0 1px 1px #c0d576;
}

form#identification fieldset fieldset legend {
  color: #111111;
  font-size: 13px;
  font-weight: normal;
  padding-bottom: 0;
}
form#identification select{
  background-color:#FFF;
}
.formfield-select {
	position: relative;
 }

.formfield-select--container {
	position: relative; 
	background-color: #fff;
	border: none;
	margin: 0 0 0 0;
	
	overflow: hidden; 
	/* 
		Le select natif pourra 
		dépasser sans être vu 
	*/
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

.formfield-select--container select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	width: 100%; 
	/* 
		On est sûr de ne plus voir
		la flèche native 
	*/
	
	height: auto;
	border: 0; 
	margin: 0;
	/*padding: .75em;*/
	border-radius: 30px;
	

	overflow: hidden;
	text-overflow: ellipsis;
	/* 
		On empêche le texte d'aller
		jusqu'au bout s'il est trop long
	*/

}

.formfield-select--container::after { 
	/* Le pointeur du select */
	content: '';
	position: absolute;
	top: 50%; 
	margin-top: -3px;
	right: .75em;  
	display: block; 
	width: 0; height: 0;
	border-color: transparent;
	border-top-color: #444; 
	border-width: 6px;
	border-style: solid;
	pointer-events: none;
}

form#identification ol li {
  background: #b9cf6a;
  background: rgba(255,255,255,.3);
  border-color: #e3ebc3;
  border-color: rgba(255,255,255,.6);
  border-style: none;
  border-width: 2px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  line-height: 30px;
  list-style: none;
  padding: 5px 10px;
  margin-bottom: 2px;
}

form#identification ol ol li {
  background: none;
  border: none;
  float: left;
 }
form#identification label {
  float: left;
  font-size: 13px;
  width: 15%;
  color:black;
}
form#identification fieldset fieldset label {
  background:none no-repeat left 50%;
  line-height: 20px;
  padding: 0 0 0 30px;
  width: auto;
}

form#identification input:not([type=radio]),
form#identification textarea {
  background: #ffffff;
  border: none;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  -khtml-border-radius: 30px;
  border-radius: 30px;
  font-style: italic;
  outline: none;
  padding: 5px;
  width: 85%;
}

form#identification input:not([type=submit]):focus,
form#identification textarea:focus {
  background: #fff;
}
form#identification input[type=radio] {
  float: left;
  margin-right: 5px;
}
form#identification button {
 float:right;
 }

/*[type=submit] { 
  display: block;
  float:right;
  opacity: 1;
  pointer-events: auto;
  padding: 10px 25px;
  margin-top: 2em;
  background: #561010;
  border: none !important;
  color: #fff;
  font-size: 80%;
  font-weight: bold;
  /*font-family: arial, serif;*/
/*  border-radius: 10px;
  cursor: pointer;	
  -webkit-transition: opacity .3s;
  -moz-transition: opacity .3s
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
  transition: opacity .3s;
}
*/
 input[type=button], input[type=submit], input[type=reset], button, .button {
	padding: 10px 25px;
	margin-top: 2em;
	display: inline-block;
	 float:right;
 color: #ffffff;
	font-size: 80%;
	cursor: pointer;
	/*background: #561010;*/
	background: #561010;
	background: linear-gradient(top, #561010 0%, #3d0000 100%);
	background: -moz-linear-gradient(top, #561010 0%, #3d0000 100%);
	background: -webkit-linear-gradient(top, #561010 0%, #3d0000 100%);
	background: -o-linear-gradient(top, #561010 0%, #3d0000 100%);
	border: 1px solid #561010;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	box-shadow:0px 0px 2px 1px rgba(0, 0, 0, 0.25), inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
	-moz-box-shadow:0px 0px 2px 1px rgba(0, 0, 0, 0.25), inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
	-webkit-box-shadow:0px 0px 2px 1px rgba(0, 0, 0, 0.25), inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
	-o-box-shadow:0px 0px 2px 1px rgba(0, 0, 0, 0.25), inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.50);
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
	background: linear-gradient(top, #702a2a 0%, #561010 100%);
	background: -moz-linear-gradient(top, #702a2a 0%, #561010 100%);
	background: -webkit-linear-gradient(top, #702a2a 0%, #561010 100%);
	background: -o-linear-gradient(top, #702a2a 0%, #561010 100%);
}
input[type=button]:active, input[type=submit]:active, input[type=reset]:active, button:active, .button:active{
	opacity:0.8;
}

.obligatoire {
 color: red;
 font-size: small;
 }
.titrecommande{
  font-size: 1.5em;
  text-align:center;
}

@media screen and (max-width:800px) {
form#identification label {
  font-size: 10px;
}

form#identification label {
  color:black;
  width: 30%;
}

form#identification input:not([type=radio]),
form#identification option,
form#identification textarea {
  width: 70%;
 }

 

